﻿<!DOCTYPE html>
<html lang="zh-CN">
<!--  -->
<!--  -->
<!--  -->
<!--  -->
<!--  -->
<!--  -->


<!--***************************************************************************************************************************************-->
<!--************************************** 阿色全息脑图 (AHMM: Arthur's Holographic Mind Map) **********************************************-->
<!--***************************************************** Ver ai⁺2025.12.9.19 *************************************************************-->
<!--****************************************************** 更新日期：2025.7.1 **************************************************************-->
<!--********************************************************** 作者：王权 ******************************************************************-->
<!--********************************************* 版权所有 自由使用 自由复制 自由共享 ********************************************************-->
<!--***************************************************************************************************************************************-->


<!--  -->
<!--  -->
<!--  -->
<!--  -->
<!--  -->
<!--  -->


<head>
    <meta charset="utf-8" />
    <meta name="keywords" content="AHMM,全息脑图,大系统观,BSV,王权,阿色,Arthur's Holographic Mind Map,Big Systems View,bjbq20120919xj,思维导图,树新风,开源,免费">
    <meta name="viewport" content="width=device-width, user-scalable=yes">
    <title id="BROWSER_TITLE">阿色全息脑图（AHMM: Arthur's Holographic Mind Map）</title>
    <link rel="shortcut icon" type="image/x-icon" href="http://www.holomind.com.cn/ahmm/favicon.ico" />
    <!--  -->
    <!--  -->
    <!--  -->
    <!--  -->
    <!--************************************************************************************************************************************-->
    <!--********************************************************* 前置 JavaScript **********************************************************-->
    <!-- 前置的作用是满足前面的html代码中，以及全文件代码均可调用 -->
    <script>

        // ************************************************************ 模仿$ ****************************************************************
        // 将 document.getElementById 用$代替
        // 置于最前，后面各处才能调用
        function $(Nid) {
            return document.getElementById(Nid);
        }

    </script>
    <!--********************************************************* 前置 JavaScript 结束 ********************************************************-->
    <!--***************************************************************************************************************************************-->
    <!--  -->
    <!--  -->
    <!--  -->
    <!--  -->
    <!--=======================================================================================================================================-->
    <!--============================================================ 定义 CSS 样式 ============================================================-->

    <style>
        /* 通用定义 */
        h1 {
            font-size: 30px;
        }

        h2 {
            font-size: 24px;
        }

        h3 {
            font-size: 16px;
        }

        h4 {
            font-size: 14px;
        }

        h5 {
            font-size: 50px;
            line-height: 55px;
        }

        logo {
            font-size: 10px;
            line-height: 11px;
        }

        a:link {
            color: black;
            text-decoration: none;
        }

        a:visited {
            color: black;
            text-decoration: none;
        }

        a:hover {
            color: #FF5500;
            text-decoration: none;
        }

        a:active {
            color: blue;
            text-decoration: none;
        }

        /* 保存数据的元素标签 <dr> 设为隐藏 */
        .data_saver {
            display: none;
        }

        /* 各个泡泡与吸引子之间的连线 */
        .link_line {
            stroke-width: 1;
            fill: none;
        }

        /* 下面几个：内部序参量，一个bubble上各个元素的格式 */
        .inner_para1 {
            display: block;
            padding-left: 0px;
            padding-right: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
            position: absolute;
            background-color: none;
            opacity: 1;
            transition: transform 0.3s ease-in-out; /* 平滑过渡效果 */
            border-radius: 50%;
            background-size: cover;
            background-position: center;
        }

        .inner_para2 {
            filter: url(#SHADOW1);
        }

        .inner_para3 {
            /*保留备用*/
        }

        .inner_para4 {
            text-anchor: middle;
            font-weight: bold;
        }

        .inner_para5 {
            text-anchor: middle;
            font-weight: bold;
            filter: url(#SHADOW2);
        }

        .inner_para6 {
            text-anchor: middle;
        }

        /* 外部参量块块的格式, DIV，每个块块是一个 DIV */
        .div_out {
            display: block;
            left: 1390px;
            width: 400px;
            height: 180px;
            padding-left: 0px;
            padding-right: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
            position: absolute;
            opacity: 1;
            transition: transform 0.3s ease-in-out; /* 平滑过渡效果 */
            background-size: cover;
            background-position: center;
        }

        /* 外部参量块块DIV内的SVG格式 */
        .svg_out {
            position:absolute; 
            left:0px; 
            top:0px; 
            width:380px; 
            height:170px;
            transform-origin: right bottom;
        }

        /* 下面几个是：外部关联参量，一个block上各个元素的格式 */
        .outer_para1 {
            fill: #A6A6A6;
            stroke: #000;
            stroke-width: 0;
            filter: url(#SHADOW1);
        }

        .outer_para2 {
            /*保留备用*/
        }

        .outer_para3 {
            font-size: 16px;
            text-anchor: start;
            font-weight: bold;
        }

        .outer_para4 {
            font-size: 36px;
            fill: #999999;
            stroke: #999999;
            stroke-width: 0;
            text-anchor: start;
            font-weight: bold;
            filter: url(#SHADOW2);
        }

        .outer_para5 {
            font-size: 36px;
            text-anchor: start;
            font-weight: bold;
        }

        .outer_para6 {
            font-size: 28px;
            text-anchor: start;
        }

        .outer_para7 {
            font-size: 24px;
            text-anchor: start;
        }

        .inner_outer_para_edit1 {
            stroke-width: 0;
            stroke: #000;
            fill: #AA0000;
            fill-opacity: 0;
        }

        .inner_outer_para_edit2 {
            fill: #888888;
            stroke: #000;
            stroke-width: 0;
            text-anchor: middle;
            cursor: text;
            -webkit-user-select: none; /* Safari */
            -moz-user-select: none; /* Firefox */
            -ms-user-select: none; /* IE10+/Edge */
            user-select: none; /* Standard syntax */
        }

        .inner_outer_para_edit3 {
            fill: #888888;
            stroke: #000;
            stroke-width: 0;
            text-anchor: middle;
            cursor: pointer;
        }

        /* 各个编辑窗口 */
        .edit_box1 {
            display: none;
            padding-left: 50px;
            padding-right: 50px;
            position: absolute;
            font-size: 22px;
            background-color: #f6f6f6;
            border: 1px solid #aaaaaa;
            opacity: 0.95;
            text-align: center;
            filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=8); /*ie <!-- 不修改 --> */
            -moz-box-shadow: 4px 4px 20px #909090; /*firefox*/
            -webkit-box-shadow: 4px 4px 20px #909090; /*safari或chrome*/
            box-shadow: 4px 4px 20px #909090; /*opera或ie9*/
        }

        /* 各个显示窗口 */
        .show_box_0 { /*padding=0*/
            display: none;
            padding-left: 0px;
            padding-right: 0px;
            padding-top: 0px;
            padding-bottom: 0px;
            position: absolute;
            font-size: 22px;
            background-color: #f6f6f6;
            border: 0px;
            opacity: 0.95;
            text-align: center;
            filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=8); /*ie <!-- 不修改 --> */
            -moz-box-shadow: 4px 4px 20px #909090; /*firefox*/
            -webkit-box-shadow: 4px 4px 20px #909090; /*safari或chrome*/
            box-shadow: 4px 4px 20px #909090; /*opera或ie9*/
        }

        .show_box_20 { /*padding=20*/
            display: none;
            padding-left: 20px;
            padding-right: 20px;
            padding-top: 20px;
            padding-bottom: 20px;
            position: absolute;
            font-size: 22px;
            background-color: #f6f6f6;
            border: 0px;
            opacity: 0.95;
            text-align: center;
            filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=8); /*ie <!-- 不修改 --> */
            -moz-box-shadow: 4px 4px 20px #909090; /*firefox*/
            -webkit-box-shadow: 4px 4px 20px #909090; /*safari或chrome*/
            box-shadow: 4px 4px 20px #909090; /*opera或ie9*/
        }

        .show_box_50 { /*padding=50*/
            display: none;
            padding-left: 50px;
            padding-right: 50px;
            position: absolute;
            font-size: 22px;
            background-color: #f6f6f6;
            border: 0px;
            opacity: 0.95;
            text-align: center;
            filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=8); /*ie <!-- 不修改 --> */
            -moz-box-shadow: 4px 4px 20px #909090; /*firefox*/
            -webkit-box-shadow: 4px 4px 20px #909090; /*safari或chrome*/
            box-shadow: 4px 4px 20px #909090; /*opera或ie9*/
        }

        /* 各个input文本框 */
        .input_text {
            height: 20px;
            font-size: 18px;
        }

        /* 各个button */
        .button_size_1 {
            height: 32px;
            font-size: 18px;
            white-space:nowrap;
        }

        .button_size_2 {
            width: 150px;
            height: 40px;
            font-size: 16px;
            white-space: nowrap;
        }

        .button_size_3 {
            width: 150px;
            height: 30px;
            font-size: 18px;
            white-space: nowrap;
        }

        .button_size_4 {
            width: 40px;
            height: 26px;
            font-size: 18px;
            white-space: nowrap;
        }

        /* 禁止内容被选择，用于控制菜单 */
        .unselectable {
            -webkit-user-select: none; /* Safari */
            -moz-user-select: none; /* Firefox */
            -ms-user-select: none; /* IE10+/Edge */
            user-select: none; /* Standard syntax */
        }

        /* 点击时闪烁 */
        @keyframes flash {
            0% {
                opacity: 1;
            }

            50% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }

        .flash {
            animation: flash 0.5s ease-in-out;
        }

        /* 高亮颜色渐变动画 */
        /* 泡泡块块动态边框动画 */
        .bubble-block-dynamic-rainbow {
            display:none;
            stroke: url(#rainbow);
            stroke-width: 8;
            fill: transparent;
            animation: 
                rainbow 2s linear infinite,
                pulse 5s ease-in-out infinite;
        }

        /* 彩虹变色动画 */
        @keyframes rainbow {
            0% { filter: hue-rotate(0deg); }
            100% { filter: hue-rotate(360deg); }
        }

        /* 脉动缩放动画 */
        @keyframes pulse {
            0%, 100% {
                transform: scale(1);
                stroke-width: 8;
            }
            50% {
                transform: scale(1);
                stroke-width: 12;
            }
        }

        /* 概述动态边框动画 */
        .gen_words-dynamic-rainbow {
            stroke: url(#rainbow);
            fill: transparent;
            animation: 
                rainbow2 2s linear infinite
        }

        /* 彩虹变色动画 */
        @keyframes rainbow2 {
            0% { filter: hue-rotate(0deg); }
            100% { filter: hue-rotate(360deg); }
        }


    </style>
    <!--  -->
    <!--  -->
    <!--========================================================= 定义 CSS 样式 结束 ==========================================================-->
    <!--=======================================================================================================================================-->
</head>

<body style="background-color:white;">
    <center>

        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->
        <!--=================================================== 数据区开始：下面文本不会显示 ==================================================-->
        <!--
        本部分具有数据文件的功能，这是AHMM.html能保存数据的原因。
        这是阿色全息脑图全息特性的核心体现。
        下面是隐藏起来用于存放数据的 div。
        这个数据区必须放在js操作代码之前，可以放在本文件body区的最顶端，否则在js之后加载，则不能使用。
        -->
        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->

        <div id="DATA_SAVER" class="data_saver">

            <!-- 数据区 -->
            <!-- 功能扩展及错误处理数据区（尚未使用，备用） -->
            <dr id="P_D_COMMON_VALUES"></dr>
            <dr id="P_D_ERROR"></dr>

            <!-- 基因数据区 -->
            <dr id="P_D_SELF_ID">1d167cbc-bdc2-4503-ba6a-ad9de03bc6b8</dr>
            <dr id="P_D_SELF_GENERATION">1</dr>
            <dr id="P_D_SELF_CREATION_TIME">2022-09-19 00:00:00</dr>
            <dr id="P_D_SELF_LAST_TIME">2025-05-15 09:43:59</dr>
            <dr id="P_D_SELF_CREATION_VERSION">Version D2022.9.19.9</dr>
            <dr id="P_D_FATHER_ID">0</dr>
            <dr id="P_D_FATHER_TITLE">大系统观阿色全息脑图AHMM</dr>
            <dr id="P_D_FATHER_INFO">自由使用 自由复制 自由分享 / 版权所有: 阿色</dr>

            <!-- 公共数据区 -->
            <dr id="P_D_SAVED">1</dr>
            <dr id="P_D_LOGO_PIC"></dr>
            <dr id="P_D_BACK_PIC"></dr>
            <dr id="P_D_BACK_MUSIC">超越.mp3</dr>
            <dr id="P_D_TITLE">什么是全息脑图？What's AHMM？</dr>
            <dr id="P_D_HOMEPAGE"></dr>
            <dr id="P_D_PREVPAGE"></dr>
            <dr id="P_D_NEXTPAGE">2-阿色全息脑图-大系统观（BSV_ Big_Systems_View）全息脑图.html</dr>
            <dr id="P_D_FACECOVER"></dr>
            <dr id="P_D_BACKCOVER"></dr>
            <dr id="P_D_HIDE_SUPPORT">0</dr>
            <dr id="P_D_IN_MARK">内部序参量</dr>
            <dr id="P_D_OUT_MARK">外部关联参量</dr>
            <dr id="P_D_GEN_WORDS">全息脑图是按照大系统观原理开发的新型思维工具，用于升维思考。让您以系统的观点看待世界，专注系统的结构信息——全息，抓住事物的本质，透过表象和数据发现规律。世间每项事物都是一个系统，其核心叫做吸引子@，内部存在几个序参量，它们决定着系统的属性和行为，外部存在若干关联参量。</dr>
            <dr id="P_D_AUTHOR">作者：阿色   2022.9.19</dr>
            <dr id="P_D_COLOR_SET_NO">43</dr>
            <dr id="P_D_COLOR_OPACITY_NO">3</dr>
            <dr id="P_D_TEXT_COLOR_NO">0</dr>
            <dr id="P_D_BORDER_COLOR_NO">2</dr>
            <dr id="P_D_BORDER_WIDTH_NO">0</dr>
            <dr id="P_D_BACKGROUND_COLOR_NO">6</dr>
            <dr id="P_D_SEQUENTIAL_PLAY"></dr>
            <dr id="P_D_SHOW_TIME">1</dr>
            <dr id="P_D_STORY_LINE"></dr>

            <!-- 内部序参量数据区 -->
            <dr id="I_D_0_X">0.45472868217054263</dr>
            <dr id="I_D_0_Y">0.25604519774011303</dr>
            <dr id="I_D_0_TEXT0">@</dr>
            <dr id="I_D_0_TEXT1">全息脑图</dr>
            <dr id="I_D_0_TEXT2">新型思维工具</dr>
            <dr id="I_D_0_TEXT3">透过表象抓本质 透过数据找规律</dr>
            <dr id="I_D_0_TEXT4">要抓大放小 不要事无巨细</dr>
            <dr id="I_D_0_LINK">(af)https://v.youku.com/v_show/id_XMjQ3MjQ0MzAyMA==.html</dr>
            <dr id="I_D_0_PIC"></dr>
            <dr id="I_D_0_SCALE">1</dr>

            <dr id="I_D_1_X">0.2469302325581395</dr>
            <dr id="I_D_1_Y">0.40512994350282483</dr>
            <dr id="I_D_1_TEXT0">[1]</dr>
            <dr id="I_D_1_TEXT1">全息</dr>
            <dr id="I_D_1_TEXT2">系统的结构性信息</dr>
            <dr id="I_D_1_TEXT3">多/高维信息 元信息 局部=整体</dr>
            <dr id="I_D_1_TEXT4">例：架构/元数据/知识/智慧/规律</dr>
            <dr id="I_D_1_LINK">(sw)(af)https://baike.baidu.com/item/%E5%85%A8%E6%81%AF%E5%AE%87%E5%AE%99%E7%90%86%E8%AE%BA/1671840?fr=aladdin</dr>
            <dr id="I_D_1_PIC"></dr>
            <dr id="I_D_1_SCALE">1</dr>

            <dr id="I_D_2_X">0.6662868217054263</dr>
            <dr id="I_D_2_Y">0.44464406779661014</dr>
            <dr id="I_D_2_TEXT0">[2]</dr>
            <dr id="I_D_2_TEXT1">脑图</dr>
            <dr id="I_D_2_TEXT2">Mind Map，即思维导图</dr>
            <dr id="I_D_2_TEXT3">图示化的思维工具</dr>
            <dr id="I_D_2_TEXT4">全息脑图是发掘本质的思维导图</dr>
            <dr id="I_D_2_LINK">(sw)https://baike.baidu.com/item/%E6%80%9D%E7%BB%B4%E5%AF%BC%E5%9B%BE/563801?fr=aladdin</dr>
            <dr id="I_D_2_PIC"></dr>
            <dr id="I_D_2_SCALE">1</dr>

            <dr id="I_D_3_X">0.8848449612403101</dr>
            <dr id="I_D_3_Y">0.46378531073446333</dr>
            <dr id="I_D_3_TEXT0">[3]</dr>
            <dr id="I_D_3_TEXT1">吸引子</dr>
            <dr id="I_D_3_TEXT2">系统的核心和灵魂</dr>
            <dr id="I_D_3_TEXT3">承载系统的全息、使命</dr>
            <dr id="I_D_3_TEXT4">是系统存在的意义和依据</dr>
            <dr id="I_D_3_LINK">(af)https://v.youku.com/v_show/id_XMTU2NjU5MzM0MA==.html?spm=a2hbt.13141534.1_2.d_13&amp;scm=20140719.manual.114461.video_XMTU2NjU5MzM0MA==</dr>
            <dr id="I_D_3_PIC"></dr>
            <dr id="I_D_3_SCALE">1</dr>

            <dr id="I_D_4_X">0.6902480620155038</dr>
            <dr id="I_D_4_Y">0.15188700564971747</dr>
            <dr id="I_D_4_TEXT0">[4]</dr>
            <dr id="I_D_4_TEXT1">内部序参量</dr>
            <dr id="I_D_4_TEXT2">表征/规定系统性质的参量</dr>
            <dr id="I_D_4_TEXT3">主导系统或事物的属性和行为</dr>
            <dr id="I_D_4_TEXT4">全息脑图中指【主题词】</dr>
            <dr id="I_D_4_LINK">(sw)(af)https://baike.baidu.com/item/%E5%8D%8F%E5%90%8C%E5%AD%A6/481834?fr=aladdin</dr>
            <dr id="I_D_4_PIC"></dr>
            <dr id="I_D_4_SCALE">1</dr>

            <dr id="I_D_5_X">0.8871240310077521</dr>
            <dr id="I_D_5_Y">0.20044067796610168</dr>
            <dr id="I_D_5_TEXT0">[5]</dr>
            <dr id="I_D_5_TEXT1">外部关联参量</dr>
            <dr id="I_D_5_TEXT2">相关但不主导系统性质</dr>
            <dr id="I_D_5_TEXT3">全息脑图中指【关联词】</dr>
            <dr id="I_D_5_TEXT4"></dr>
            <dr id="I_D_5_LINK"></dr>
            <dr id="I_D_5_PIC"></dr>
            <dr id="I_D_5_SCALE">1</dr>

            <dr id="I_D_6_X">0.1390387596899225</dr>
            <dr id="I_D_6_Y">0.18458757062146894</dr>
            <dr id="I_D_6_TEXT0">[6]</dr>
            <dr id="I_D_6_TEXT1">升维思考</dr>
            <dr id="I_D_6_TEXT2">多维度/角度/尺度 超时空</dr>
            <dr id="I_D_6_TEXT3">目标太大太小都会迷失</dr>
            <dr id="I_D_6_TEXT4">跳出三界外 不在五行中</dr>
            <dr id="I_D_6_LINK"></dr>
            <dr id="I_D_6_PIC"></dr>
            <dr id="I_D_6_SCALE">1</dr>

            <dr id="I_D_7_X">0.06</dr>
            <dr id="I_D_7_Y">0.5</dr>
            <dr id="I_D_7_TEXT0">[7]</dr>
            <dr id="I_D_7_TEXT1">阿色</dr>
            <dr id="I_D_7_TEXT2">全息脑图创立者</dr>
            <dr id="I_D_7_TEXT3">本软件作者</dr>
            <dr id="I_D_7_TEXT4"></dr>
            <dr id="I_D_7_LINK"></dr>
            <dr id="I_D_7_PIC"></dr>
            <dr id="I_D_7_SCALE">1</dr>

            <dr id="I_D_8_X">0.2808527131782946</dr>
            <dr id="I_D_8_Y">0.11107344632768362</dr>
            <dr id="I_D_8_TEXT0">[8]</dr>
            <dr id="I_D_8_TEXT1">黄金序律</dr>
            <dr id="I_D_8_TEXT2">把握事物用7个序参量</dr>
            <dr id="I_D_8_TEXT3">1个核心/2~3个关键/3~5个主要</dr>
            <dr id="I_D_8_TEXT4"></dr>
            <dr id="I_D_8_LINK"></dr>
            <dr id="I_D_8_PIC"></dr>
            <dr id="I_D_8_SCALE">1</dr>

            <dr id="I_D_9_X">0.4327674418604651</dr>
            <dr id="I_D_9_Y">0.5426779661016949</dr>
            <dr id="I_D_9_TEXT0"></dr>
            <dr id="I_D_9_TEXT1"></dr>
            <dr id="I_D_9_TEXT2"></dr>
            <dr id="I_D_9_TEXT3"></dr>
            <dr id="I_D_9_TEXT4"></dr>
            <dr id="I_D_9_LINK"></dr>
            <dr id="I_D_9_PIC"></dr>
            <dr id="I_D_9_SCALE">1</dr>

            <dr id="I_D_10_X">0.579</dr>
            <dr id="I_D_10_Y">0.043</dr>
            <dr id="I_D_10_TEXT0"></dr>
            <dr id="I_D_10_TEXT1"></dr>
            <dr id="I_D_10_TEXT2"></dr>
            <dr id="I_D_10_TEXT3"></dr>
            <dr id="I_D_10_TEXT4"></dr>
            <dr id="I_D_10_LINK"></dr>
            <dr id="I_D_10_PIC"></dr>
            <dr id="I_D_10_SCALE">1</dr>

            <dr id="I_D_11_X">0.793</dr>
            <dr id="I_D_11_Y">0.107</dr>
            <dr id="I_D_11_TEXT0"></dr>
            <dr id="I_D_11_TEXT1"></dr>
            <dr id="I_D_11_TEXT2"></dr>
            <dr id="I_D_11_TEXT3"></dr>
            <dr id="I_D_11_TEXT4"></dr>
            <dr id="I_D_11_LINK"></dr>
            <dr id="I_D_11_PIC"></dr>
            <dr id="I_D_11_SCALE">1</dr>

            <!-- 外部关联参量数据区 -->
            <dr id="O_D_1_TEXT0">[1]</dr>
            <dr id="O_D_1_TEXT1">《大系统观》</dr>
            <dr id="O_D_1_TEXT2">全息有机系统论看待世界</dr>
            <dr id="O_D_1_TEXT3">免费开源电子书，百度可得</dr>
            <dr id="O_D_1_LINK">(sw)(af)http://www.holomind.com.cn/bsv/%E5%A4%A7%E7%B3%BB%E7%BB%9F%E8%A7%82-A1.0(20160214-aqw)%E5%8F%91%E5%B8%83%E7%A8%BF.pdf</dr>
            <dr id="O_D_1_PIC"></dr>

            <dr id="O_D_2_TEXT0">[2]</dr>
            <dr id="O_D_2_TEXT1">序参量/主要矛盾</dr>
            <dr id="O_D_2_TEXT2">热力学和协同学基本概念</dr>
            <dr id="O_D_2_TEXT3">支配系统行为，主宰系统演化</dr>
            <dr id="O_D_2_LINK">(sw)(af)https://baike.baidu.com/item/%E5%8D%8F%E5%90%8C%E5%AD%A6/481834?fr=aladdin</dr>
            <dr id="O_D_2_PIC"></dr>

            <dr id="O_D_3_TEXT0">[3]</dr>
            <dr id="O_D_3_TEXT1">全息照片(真全息)</dr>
            <dr id="O_D_3_TEXT2">底片碎片可显示整个影像</dr>
            <dr id="O_D_3_TEXT3">记录光波的振幅、频率和相位</dr>
            <dr id="O_D_3_LINK">(sw)(af)https://baike.baidu.com/item/%E5%85%A8%E6%81%AF%E7%85%A7%E7%89%87/198667?fr=aladdin</dr>
            <dr id="O_D_3_PIC"></dr>

            <dr id="O_D_4_TEXT0">[4]</dr>
            <dr id="O_D_4_TEXT1">制作软件</dr>
            <dr id="O_D_4_TEXT2">AHMM：全息思想编制</dr>
            <dr id="O_D_4_TEXT3">神奇：HTML具有保存数据能力</dr>
            <dr id="O_D_4_LINK">(af)https://www.cnblogs.com/BigSystemsView/p/16694399.html</dr>
            <dr id="O_D_4_PIC"></dr>

            <dr id="O_D_5_TEXT0">[5]</dr>
            <dr id="O_D_5_TEXT1">阿色寄语</dr>
            <dr id="O_D_5_TEXT2">诚挚欢迎批评指正！</dr>
            <dr id="O_D_5_TEXT3">免费开源 共同开发 迭代精进</dr>
            <dr id="O_D_5_LINK"></dr>
            <dr id="O_D_5_PIC"></dr>

        </div>   <!-- <div id="DATA_SAVER">结束 -->
        <!--  -->
        <!--  -->
        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->
        <!--===================================================== 数据区结束：上面文本不会显示 ===================================================-->
        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->
        <!--  -->
        <!--  -->
        <!--  -->
        <!--  -->
        <!--  -->
        <!--  -->
        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->
        <!--========================================= 下面是html主体文本，包括svg 框架和各个编辑窗口两部分 ========================================-->
        <!--===================================================================================================================================-->
        <!--===================================================================================================================================-->
        <!--  -->
        <!--  -->
        <!--================================== 下面是svg 框架文本，它内部的一些数据由js修改形成最终html =======================================-->
        <!--  -->
        <!--  -->
        <!--================================ 下面是装载全部部件的div，但不包括浏览当前目录/本地文件的部分 =====================================-->
        <div id="DIV_ALL" style="display: none; background-color: #FFFFFF; position: absolute; left: 0px; top: 0px; display: none; ">
            <!--  -->
            <!--  -->
            <!--===================== 下面是置于顶层的黑色覆盖层，最先放置是为了防止下面的图层闪烁 =====================-->
            <div id="WELCOME_COVER" style="display:block; position:absolute; left:0px; top:0px; width:1920px; height:1080px; overflow:hidden; background-color:#000000; border:0px solid #666666; opacity:0.93; z-index:9000; "></div>
            <script>
                $("DIV_ALL").style.display = "none";  // 此处需设置，否则保存后值将改变，再次打开时内容会闪一下
                $("WELCOME_COVER").style.display = "block";
            </script>
            <!--  -->
            <!--  -->
            <!--=============================== 下面是绘制内外部序参量及相关部件的画布 =================================-->
            <div id="DIV_WHOLE_CANVAS" style="background-color: #FFFFFF; position: absolute; left: 15px; top: 0px; overflow: hidden;">
                <!-- 整个绘图区的DIV：包括logo、标题、概述、各个主题词bubble、各个外部关联参量block，左右标签、版权作者、控制菜单条、序参量连线、中央灰色背景 -->
                <!--                  不包括编辑操作窗口、提示窗口等         -->
                <!--============================== 下面是头部LOGO、标题、功能图标等 ============================-->
                <div id="DIV_WORK">
                    <!-- 全部工作区DIV -->

                    <div id="DIV_LOGO_BACK" style="position: absolute; left: 78px; top: 0px; width: 156px; height: 40px; color: #FF0000; background-color: #FFFFFF; float: left; ">
                        <!-- LOGO 背景的DIV -->
                        &nbsp;
                    </div>

                    <div id="DIV_LOGO_SMALL" style="position: absolute; top: 0px; width: 136px; color:#FF0000; background-color:transparent; border: 0px dashed #FF0000; float:left; text-align:left; ">
                        <!-- 左上角LOGO的DIV -->
                        <span id="CHANGE_LOGO" onclick="editLogo();" title="设置【Logo】" class="unselectable" style="cursor: text; color: #666666; font-size: 23px; line-height: 5px; "
                              onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000'; $('DIV_LOGO_SMALL_PIC').style.border='3px dashed #FF5500';"
                              onmouseout="this.style.color='#888888'; this.style.backgroundColor='rgba(255,255,255,0)'; $('DIV_LOGO_SMALL_PIC').style.border='0px dashed #FF5500';">...</span>

                        <a href="http://www.holomind.com.cn" target="_blank">
                            <div id="DIV_LOGO_SMALL_PIC" style="position: absolute; top: 20px; width: 146px; color:#FF0000; background-color:transparent; border: 0px dashed #FF5500; float:left; text-align:center; font-size:10px; line-height:9px; "
                                 onmouseover="$('DIV_LOGO_SMALL_PIC').style.border='3px dashed #FF5500';"
                                 onmouseout="$('DIV_LOGO_SMALL_PIC').style.border='0px dashed #FF5500';">
                                <table id="AHMM_LOGO_TEXT" style="display: none; font-size: 10px; line-height: 9px; ">
                                    <tr>
                                        <td style="width: 146px; text-align: center;">
                                            <br />
                                            <span style="cursor:pointer; color:#FF0000;" title="AHMM：阿色版权所有 您可自由使用 点击获取最新版本">
                                                ╔══╦╗╔╦═╦═╦═╦═╗<br />
                                                ║╔╗║╚╝║║║║║║║║║<br />
                                                ║╠╣║╔╗║║║║║║║║║<br />
                                                ╚╝╚╩╝╚╩╩═╩╩╩═╩╝<br />
                                            </span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <span id="AHMM_VERSION1" style="cursor:pointer; color:#FF0000;">Version D20120919.x</span><br /><br />
                                        </td>
                                    </tr>
                                </table>
                                <img id="LOGO_PIC_IMG" src="" border="0" style="width:100px; display:block;" alt="Logo图片打开失败：Logo图片需要与本脑图文件(html)存储于同一文件夹。">
                            </div>
                        </a>
                    </div>

                    <div id="DIV_TITLE" style="position: absolute; left: 231px; top: 0px; width: 1441px; height: 40px;background-color: #FFFFFF; text-align: center; z-index: 2001;">
                        <!-- 全息脑图标题的DIV -->
                        <h1>
                            <b>
                                <br />
                                <span id="MAP_TITLE" style="font-size: 48px; cursor: default; text-shadow: 2px 2px #BBBBBB; color: #000000;"
                                      onmouseover="this.style.color='#FF5500';"
                                      onmouseout="this.style.color='#000000';">阿色全息脑图（AHMM: Arthur's Holographic Mind Map）</span>
                                <span id="MAP_TITLE2" title="* 编辑【标题】【链接页】【封面】【封底】&#10;* 更改【通用设置】" class="unselectable" style="cursor:text; color:#666666; font-size:23px;"
                                      onclick="editTitle();"
                                      onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000'; $('MAP_TITLE').style.color='#FF5500';"
                                      onmouseout="this.style.color='#888888'; this.style.backgroundColor='rgba(255,255,255,0)'; $('MAP_TITLE').style.color='#000000';">...</span>
                            </b>
                        </h1><br />
                    </div>

                    <div id="DIV_FUNC_BACK" style="position: absolute; left: 1669px; top: 0px; width: 134px; height: 40px; background-color: #FFFFFF; text-align: center; z-index: 2000;"></div>
                    <div id="DIV_FUNC" class="unselectable" style="background-color: #888888; width:245px; height:22px; color: #FFFFFF; text-align:left; left:1616px; top:0px; position:absolute; z-index: 8007;">
                        <!-- 功能菜单的DIV -->

                        <div id="CANCEL_FULL_SCREEN" title="【退出播放】(快捷键：【Esc】）&#10; 连按【Esc】返回【编辑页面】" style="animation: blinker 2s linear infinite; color: #FF0000; width: 30px; height: 22px; cursor: pointer; display: none; font-size: 20px; line-height: 20px; float: right; text-align: center; "
                             onclick="exitFromFullScreen();"
                             onmouseover="this.style.color = '#FFFFFF'; this.style.backgroundColor = '#AA0000'; showCtrlBarForFullScreen2();"
                             onmouseout="this.style.color = '#FF0000'; this.style.backgroundColor = 'transparent'; hideCtrlBarForFullScreen2();">...</div>
                        <style>
                            @keyframes blinker {
                                50% {
                                    opacity: 0;
                                }
                            }
                        </style>
                        <div id="CLOSE_THIS_PAGE" title="【关闭本页】" style="width: 30px; height: 22px; font-size: 16px; line-height: 20px; cursor: pointer; float: right; text-align: center;"
                             onclick="quitAHMMWithConfirm();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">✕</div>
                        <div id="ENTER_FULL_SCREEN" title="【全屏播放】(快捷键：【F10】）&#10; * 播放时支持键盘、鼠标和翻页笔&#10; * 建议同时开启浏览器自带【全屏】&#10;功能（快捷键：一般为【F11】）" style="width: 30px; height: 22px; cursor: pointer; font-size: 30px; line-height: 20px; float: right; text-align: center; margin-top: -1px;"
                             onclick="goIntoFullScreenAndPlay();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">▸</div>
                        <div style="width: 3px; background-color: transparent; height: 22px; color: #444444; text-align: center; float: right;"></div>
                        <div id="NEXT_ITEM" title="【后一项】" style="display: block; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="nextItem();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">⇨</div>
                        <div id="PREV_ITEM" title="【前一项】" style="display: block; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="prevItem();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">⇦</div>
                        <div id="NEXT_PAGE" title="【下一页】" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="nextPage();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">⇩</div>
                        <div id="PREV_PAGE" title="【上一页】" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="prevPage();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">⇧</div>
                        <div id="HOME_PAGE" title="【起始页】" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="homePage();"
                             onmouseover="this.style.color = '#FFFFFF'; this.style.backgroundColor = '#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">☉</div>
                        <div id="DIR_PAGE" title="【当前目录/本地】" style="width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 15px; line-height: 20px; float: right; text-align: center;"
                             onclick="showDir();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';">.</div>
                    </div>

                    <div id="DIV_FUNC2" class="unselectable" style="display: none; background-color: #888888; width: 125px; height: 22px; color: #FFFFFF; text-align: left; left: 1646px; top: 0px; position: absolute; z-index: 8007;">
                        <!-- 全屏时的功能菜单的DIV -->

                        <div style="width: 3px; background-color: #FFFFFF; height: 22px; color: #444444; text-align: center; float: right;"></div>
                        <div id="NEXT_ITEM2" title="【后一项】(快捷键：【→】 )" style="display: block; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="nextItem();"
                             onmouseover="this.style.color = '#FFFFFF'; this.style.backgroundColor = '#AA0000'; g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">⇨</div>
                        <div id="PREV_ITEM2" title="【前一项】(快捷键：【←】 )" style="display: block; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="prevItem();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">⇦</div>
                        <div id="NEXT_PAGE2" title="【下一页】(快捷键：【↓】 )" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="nextPage();"
                             onmouseover="this.style.color = '#FFFFFF'; this.style.backgroundColor = '#AA0000'; g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">⇩</div>
                        <div id="PREV_PAGE2" title="【上一页】(快捷键：【↑】 )" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="prevPage();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">⇧</div>
                        <div id="HOME_PAGE2" title="【起始页】(快捷键：【Home】)" style="display: none; width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 17px; line-height: 20px; float: right; text-align: center;"
                             onclick="homePage();"
                             onmouseover="this.style.color = '#FFFFFF'; this.style.backgroundColor = '#AA0000';g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">☉</div>
                        <div id="DIR_PAGE2" title="【当前目录/本地】(快捷键：【End】)" style="width: 30px; height: 22px; cursor: pointer; color: #FFFFFF; font-size: 15px; line-height: 20px; float: right; text-align: center;"
                             onclick="showDir();"
                             onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';g_menuBarShouldDisplay = true;"
                             onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='rgba(255,255,255,0)';hideCtrlBarForFullScreen2();">.</div>
                    </div>

                    <div id="MENU_CHAR" class="unselectable" style="width: 30px; height: 22px; background-color: #FFFF00; cursor: pointer; font-size: 20px; line-height: 20px; text-align: center; left: 1583px; top: 0px; position: absolute; z-index: 2001;"
                         onclick="showHideFuncMenu();" title="【功能菜单】"
                         onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.color='#000000'; this.style.backgroundColor='#FFFF00';">≚</div>

                    <div id="CANCEL_FULL_SCREEN_HINT" class="unselectable" style="display: none; transition: opacity 5s ease-in-out; position: absolute; left: 1395px; top: 25px; width: 400px; height: 40px; background-color: transparent; z-index: 8007;">
                        <!-- 全屏时的提示退出播放的DIV -->
                        <svg height="40" width="400">
                            <polygon points="0,10 0,30 400,30 400,10 395,10 390,0 385,10" style="fill:#AA0000; stroke:#FFFFFF; stroke-width:0" filter="url(#GUIDE_SHADOW);" />
                            <text x="7" y="25" font-size="15" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve">点击【...】或按【Esc】键【退出播放】，进入【编辑状态】</text>
                        </svg>
                    </div>
                    <!--  -->
                    <!--  -->
                    <!-- 背景音乐。伴随脑图的播放开始和结束 -->
                    <audio id="BACK_MUSIC" src="" type="audio/mp3" loop></audio>

                    <!--==================== 下面是内部序参量圆泡泡bubble、外部关联参量块块block图svg 框架文本 ====================-->
                    <svg id="SVG_MAIN" style="position: absolute; top: 140px; left:81px;">
                        <!-- 内部序参量连接线等。外部关联参量块块、内部序参量泡泡不在这里，因为它们需要拖动和放大，每个泡泡、块块要用一个DIV装载，无法在SVG中。 -->

                        <!-- 圆泡泡bubble和方块block阴影、内部文字阴影  -->
                        <defs>
                            <filter id="SHADOW1"><feGaussianBlur stdDeviation="4" in="SourceGraphic"></feGaussianBlur>  </filter>
                            <filter id="SHADOW2"><feGaussianBlur stdDeviation="2" in="SourceGraphic"></feGaussianBlur>  </filter>
                        </defs>

                        <!-- 背景图片，保持原比例自动充满，尺寸等在后面设定，与SVG_MAIN同 -->
                        <image id="BACK_PIC_IMG" preserveAspectRatio="xMidYMid slice" style="display: block;" />

                        <!-- SVG_MAIN的边框，仅用于设置背景图片/音乐时闪一下，尺寸等在后面设定，与SVG_MAIN同 -->
                        <rect id="SVG_MAIN_BORDER" x="0" y="0" rx="0" stroke="#FF5500" stroke-width="30" stroke-dasharray="30 15" fill="none" style="display:none;" />

                        <!-- 用于接收鼠标单击。单击时等同于按键【下一项】。尺寸等在后面设定，与SVG_MAIN同 -->
                        <rect id="SVG_MAIN_RECT_4_NEXTITEM" x="0" y="0" rx="0" stroke-width="0" fill="red" fill-opacity="0" onclick="nextItem();"/>

                        <!-- 设置背景图片/音乐：点击...时进入设置窗口 -->
                        <g>
                            <title>设置【背景图片/音乐】</title>
                            <rect id="CHANGE_BACK_PIC_MUSIC_2" x="18" y="18" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                            <text id="CHANGE_BACK_PIC_MUSIC" x="30" y="30" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editBackPicMusic();" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100';$('SVG_MAIN_BORDER').style.display='block';" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; $('SVG_MAIN_BORDER').style.display='none';">...</text>
                        </g>

                        <!--  内部序参量连接线  -->
                        <!--  定义连线的箭头  -->  
                        <!--  关于连线的笔记：连线应一直处在泡泡和块块的下面。当移动泡泡到块块上面时，连线也不应处在块块上面。
                            所以，不应该在泡泡被移动到块块之上时试图将连线也置于块块之上。已经考虑此问题，并修改过，但最后还是改回来了。 -->
                        <defs>  
                            <marker id="arrow1" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                            <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>  
                            <marker id="arrow2" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker> 
                            <marker id="arrow3" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow4" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow5" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow6" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow7" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow8" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow9" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow10" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker>
                            <marker id="arrow11" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">  
                                <path d="M0,0 L0,6 L9,3 z" fill="#000000" />  
                            </marker> 
                        </defs>  
                        <line id="LN0" class="link_line" />
                        <line id="LN1" class="link_line" marker-end="url(#arrow1)" />
                        <line id="LN2" class="link_line" marker-end="url(#arrow2)" />
                        <line id="LN3" class="link_line" marker-end="url(#arrow3)" />
                        <line id="LN4" class="link_line" marker-end="url(#arrow4)" />
                        <line id="LN5" class="link_line" marker-end="url(#arrow5)" />
                        <line id="LN6" class="link_line" marker-end="url(#arrow6)" />
                        <line id="LN7" class="link_line" marker-end="url(#arrow7)" />
                        <line id="LN8" class="link_line" marker-end="url(#arrow8)" />
                        <line id="LN9" class="link_line" marker-end="url(#arrow9" />
                        <line id="LN10" class="link_line" marker-end="url(#arrow10)" />
                        <line id="LN11" class="link_line" marker-end="url(#arrow11)" />

                        <!-- 播放时，高亮彩虹边框闪烁时使用 -->
                        <defs>
                            <linearGradient id="rainbow">
                                <stop offset="0%" stop-color="#FF0000"/>
                                <stop offset="25%" stop-color="#FF7F00"/>
                                <stop offset="50%" stop-color="#FFFF00"/>
                                <stop offset="75%" stop-color="#00FF00"/>
                                <stop offset="100%" stop-color="#0000FF"/>
                            </linearGradient>
                        </defs>

                        <!-- 内部序参量指示签  -->
                        <g>
                            <rect id="IN_PR1" stroke-width="0" height="180" width="20" y="354" x="2" stroke="#000" fill="#AAAAAA" filter="url(#SHADOW2)" />
                            <rect id="IN_PR2" stroke-width="0" height="180" width="20" y="352" x="0" stroke="#000" fill="#666666" />
                            <text id="IN_MARK" xml:space="preserve" text-anchor="start" font-size="16" x="10" stroke-width="0" stroke="#000" fill="#ffffff" style="writing-mode: vertical-rl; cursor:default;">内部序参量</text>
                        </g>
                        <script type="text/javascript">
                            // 变色
                            var textElement1 = $('IN_MARK');
                            textElement1.addEventListener('mouseover', function () {
                                this.setAttribute('fill', 'rgb(255, 85, 0)');
                            });
                            textElement1.addEventListener('mouseout', function () {
                                this.setAttribute('fill', 'rgb(255, 255, 255)');
                            });
                        </script>
                        <g>
                            <title>编辑【左标签】</title>
                            <rect id="IN_MARK_CLICK_2" x="0" y="533" rx="0" width="20" height="15" class="inner_outer_para_edit1" />
                            <text id="IN_MARK_CLICK" x="10" y="541" font-size="23" class="inner_outer_para_edit2" xml:space="preserve"
                                  onclick="editInMark();"
                                  style="cursor:text;"
                                  onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; textElement1.setAttribute('fill', 'rgb(255, 85, 0)');"
                                  onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; textElement1.setAttribute('fill', 'rgb(255, 255, 255)');">...</text>-->
                        </g>

                        <!--  外部关联参量指示签 -->
                        <g>
                            <rect id="OUT_PR1" stroke-width="0" height="180" width="20" y="354" x="1696" stroke="#000" fill="#AAAAAA" filter="url(#SHADOW2)" />
                            <rect id="OUT_PR2" stroke-width="0" height="180" width="20" y="352" x="1698" stroke="#000" fill="#666666" />
                            <text id="OUT_MARK" xml:space="preserve" text-anchor="start" font-size="16" x="1708" stroke-width="0" stroke="#000" fill="#ffffff" style="writing-mode: vertical-rl; cursor:default;">外部关联参量</text>
                        </g>
                        <script type="text/javascript">
                            // 变色
                            var textElement2 = $('OUT_MARK');
                            textElement2.addEventListener('mouseover', function () {
                                this.setAttribute('fill', 'rgb(255, 85, 0)');
                            });
                            textElement2.addEventListener('mouseout', function () {
                                this.setAttribute('fill', 'rgb(255, 255, 255)');
                            });
                        </script>
                        <g>
                            <title>编辑【右标签】</title>
                            <rect id="OUT_MARK_CLICK_2" x="1698" y="533" rx="0" width="20" height="15" class="inner_outer_para_edit1" />
                            <text id="OUT_MARK_CLICK" x="1708" y="541" font-size="23" class="inner_outer_para_edit2" xml:space="preserve"
                                  onclick="editOutMark();"
                                  style="cursor:text;"
                                  onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; textElement2.setAttribute('fill', 'rgb(255, 85, 0)');"
                                  onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; textElement2.setAttribute('fill', 'rgb(255, 255, 255)');">...</text>
                        </g>

                    </svg><!-- 连线等结束 -->

                </div><!-- <div  id="DIV_WORK">结束 -->
                <!--  -->
                <!--  -->
                <!--  -->
                <!--  -->
                <!-- 下面是外部关联参量，每个块块都是一个单独的div，为了放大 -->
                <div id="DIV_OUT_1" class="div_out" style="top: 160px;">
                    <svg class="svg_out">
                        <g id="G_OUT_1">
                            <g id="OUTER_PARA_1" onclick="" onmouseover="highLightBlock(1);" onmouseout="deHighLightBlock(1);" style="cursor: default; ">
                                <rect id="RT_1_1" x="15" y="15" rx="21" width="357" height="150" class="outer_para1" />
                                <rect id="RT_1_2" x="10" y="10" rx="21" width="357" height="150" class="outer_para2" />
                                <rect id="RT_1_3" x="10" y="10" rx="21" width="357" height="150" class="bubble-block-dynamic-rainbow" />
                                <image id="O_P1_PIC" x="20" y="20" width="337" height="130" style="display: none;" />
                                <text id="O_P1_T0" x="30" y="30" xml:space="preserve" class="outer_para3">[1]</text>
                                <text id="O_P1_T1_1" x="52" y="72" xml:space="preserve" class="outer_para4"></text>
                                <text id="O_P1_T1_2" x="50" y="70" xml:space="preserve" class="outer_para5"></text>
                                <text id="O_P1_T2" x="40" y="106" xml:space="preserve" class="outer_para6"></text>
                                <text id="O_P1_T3" x="40" y="135" xml:space="preserve" class="outer_para7"></text>
                                <g>
                                    <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                                    <text id="O_P1_LM" x="54" y="155" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBlock(1);" onmouseout="this.style.fill='#888888'; deHighLightBlock(1);">»»»</text>
                                </g>
                            </g>
                            <g>
                                <title>编辑【外部关联参量 1】</title>
                                <rect id="O_P1_T4_2" x="317" y="134" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                                <text id="O_P1_T4" x="330" y="145" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editOuterPara(1);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBlock(1);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBlock(1);">...</text>
                            </g>
                        </g>
                    </svg>
                </div>

                <div id="DIV_OUT_2" class="div_out" style="top: 330px;">
                    <svg class="svg_out">
                        <g id="G_OUT_2">
                            <g id="OUTER_PARA_2" onclick="" onmouseover="highLightBlock(2);" onmouseout="deHighLightBlock(2);" style="cursor: default; ">
                                <rect id="RT_2_1" x="15" y="15" rx="21" width="357" height="150" class="outer_para1" />
                                <rect id="RT_2_2" x="10" y="10" rx="21" width="357" height="150" class="outer_para2" />
                                <rect id="RT_2_3" x="10" y="10" rx="21" width="357" height="150" class="bubble-block-dynamic-rainbow" />
                                <image id="O_P2_PIC" x="20" y="20" width="337" height="130" style="display: none;" />
                                <text id="O_P2_T0" x="30" y="30" xml:space="preserve" class="outer_para3">[2]</text>
                                <text id="O_P2_T1_1" x="52" y="72" xml:space="preserve" class="outer_para4"></text>
                                <text id="O_P2_T1_2" x="50" y="70" xml:space="preserve" class="outer_para5"></text>
                                <text id="O_P2_T2" x="40" y="106" xml:space="preserve" class="outer_para6"></text>
                                <text id="O_P2_T3" x="40" y="135" xml:space="preserve" class="outer_para7"></text>
                                <g>
                                    <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                                    <text id="O_P2_LM" x="54" y="155" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBlock(2);" onmouseout="this.style.fill='#888888'; deHighLightBlock(2);">»»»</text>
                                </g>
                            </g>
                            <g>
                                <title>编辑【外部关联参量 2】</title>
                                <rect id="O_P2_T4_2" x="317" y="134" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                                <text id="O_P2_T4" x="330" y="145" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editOuterPara(2);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBlock(2);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBlock(2);">...</text>
                            </g>
                        </g>
                    </svg>
                </div>

                <div id="DIV_OUT_3" class="div_out" style="top: 500px;">
                    <svg class="svg_out">
                        <g id="G_OUT_3">
                            <g id="OUTER_PARA_3" onclick="" onmouseover="highLightBlock(3);" onmouseout="deHighLightBlock(3);" style="cursor: default; ">
                                <rect id="RT_3_1" x="15" y="15" rx="21" width="357" height="150" class="outer_para1" />
                                <rect id="RT_3_2" x="10" y="10" rx="21" width="357" height="150" class="outer_para2" />
                                <rect id="RT_3_3" x="10" y="10" rx="21" width="357" height="150" class="bubble-block-dynamic-rainbow" />
                                <image id="O_P3_PIC" x="20" y="20" width="337" height="130" style="display: none;" />
                                <text id="O_P3_T0" x="30" y="30" xml:space="preserve" class="outer_para3">[3]</text>
                                <text id="O_P3_T1_1" x="52" y="72" xml:space="preserve" class="outer_para4"></text>
                                <text id="O_P3_T1_2" x="50" y="70" xml:space="preserve" class="outer_para5"></text>
                                <text id="O_P3_T2" x="40" y="106" xml:space="preserve" class="outer_para6"></text>
                                <text id="O_P3_T3" x="40" y="135" xml:space="preserve" class="outer_para7"></text>
                                <g>
                                    <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                                    <text id="O_P3_LM" x="54" y="155" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBlock(3);" onmouseout="this.style.fill='#888888'; deHighLightBlock(3);">»»»</text>
                                </g>
                            </g>
                            <g>
                                <title>编辑【外部关联参量 3】</title>
                                <rect id="O_P3_T4_2" x="317" y="134" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                                <text id="O_P3_T4" x="330" y="145" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editOuterPara(3);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBlock(3);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBlock(3);">...</text>
                            </g>
                        </g>
                    </svg>
                </div>

                <div id="DIV_OUT_4" class="div_out" style="top: 670px;">
                    <svg class="svg_out">
                        <g id="G_OUT_4">
                            <g id="OUTER_PARA_4" onclick="" onmouseover="highLightBlock(4);" onmouseout="deHighLightBlock(4);" style="cursor: default; ">
                                <rect id="RT_4_1" x="15" y="15" rx="21" width="357" height="150" class="outer_para1" />
                                <rect id="RT_4_2" x="10" y="10" rx="21" width="357" height="150" class="outer_para2" />
                                <rect id="RT_4_3" x="10" y="10" rx="21" width="357" height="150" class="bubble-block-dynamic-rainbow" />
                                <image id="O_P4_PIC" x="20" y="20" width="337" height="130" style="display: none;" />
                                <text id="O_P4_T0" x="30" y="30" xml:space="preserve" class="outer_para3">[4]</text>
                                <text id="O_P4_T1_1" x="52" y="72" xml:space="preserve" class="outer_para4"></text>
                                <text id="O_P4_T1_2" x="50" y="70" xml:space="preserve" class="outer_para5"></text>
                                <text id="O_P4_T2" x="40" y="106" xml:space="preserve" class="outer_para6"></text>
                                <text id="O_P4_T3" x="40" y="135" xml:space="preserve" class="outer_para7"></text>
                                <g>
                                    <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                                    <text id="O_P4_LM" x="54" y="155" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBlock(4);" onmouseout="this.style.fill='#888888'; deHighLightBlock(4);">»»»</text>
                                </g>
                            </g>
                            <g>
                                <title>编辑【外部关联参量 4】</title>
                                <rect id="O_P4_T4_2" x="317" y="134" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                                <text id="O_P4_T4" x="330" y="145" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editOuterPara(4);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBlock(4);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBlock(4);">...</text>
                            </g>
                        </g>
                    </svg>
                </div>

                <div id="DIV_OUT_5" class="div_out" style="top: 840px;">
                    <svg class="svg_out">
                        <g id="G_OUT_5">
                            <g id="OUTER_PARA_5" onclick="" onmouseover="highLightBlock(5);" onmouseout="deHighLightBlock(5);" style="cursor: default; ">
                                <rect id="RT_5_1" x="15" y="15" rx="21" width="357" height="150" class="outer_para1" />
                                <rect id="RT_5_2" x="10" y="10" rx="21" width="357" height="150" class="outer_para2" />
                                <rect id="RT_5_3" x="10" y="10" rx="21" width="357" height="150" class="bubble-block-dynamic-rainbow" />
                                <image id="O_P5_PIC" x="20" y="20" width="337" height="130" style="display: none;" />
                                <text id="O_P5_T0" x="30" y="30" xml:space="preserve" class="outer_para3">[5]</text>
                                <text id="O_P5_T1_1" x="52" y="72" xml:space="preserve" class="outer_para4"></text>
                                <text id="O_P5_T1_2" x="50" y="70" xml:space="preserve" class="outer_para5"></text>
                                <text id="O_P5_T2" x="40" y="106" xml:space="preserve" class="outer_para6"></text>
                                <text id="O_P5_T3" x="40" y="135" xml:space="preserve" class="outer_para7"></text>
                                <g>
                                    <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                                    <text id="O_P5_LM" x="54" y="155" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBlock(5);" onmouseout="this.style.fill='#888888'; deHighLightBlock(5);">»»»</text>
                                </g>
                            </g>
                            <g>
                                <title>编辑【外部关联参量 5】</title>
                                <rect id="O_P5_T4_2" x="317" y="134" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                                <text id="O_P5_T4" x="330" y="145" font-size="23" class="inner_outer_para_edit2" xml:space="preserve" onclick="editOuterPara(5);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBlock(5);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBlock(5);">...</text>
                            </g>
                        </g>
                    </svg>
                </div>
                <!--  -->
                <!--  -->
                <!--  -->
                <!--  -->
                <!-- 下面是内部序参量泡泡，每个泡泡用一个DIV装载，不在上面<svg id="SVG_MAIN">中，以便拖动。 -->
                <div id="DIV_IN_1" class="inner_para1">
                    <svg id="SVG_1" style="background-color:none;">

                        <g id="INNER_PARA_1" onclick="" onmouseover="highLightBubble(1);" onmouseout="deHighLightBubble(1);" style="cursor:default;">
                            <circle id="CR_1_1" cx="918.5852766452272" cy="384.2840394910918" r="116.10000000000001" class="inner_para2"></circle>
                            <circle id="CR_1_2" cx="913.5852766452272" cy="379.2840394910918" r="116.10000000000001" class="inner_para3"></circle>
                            <circle id="CR_1_3" class="bubble-block-dynamic-rainbow"></circle>
                            <defs>
                                <!-- 后面各个泡泡都引用此定义 -->
                                <clipPath id="circleClip" clipPathUnits="objectBoundingBox">
                                    <circle cx="0.5" cy="0.5" r="0.43" />
                                </clipPath>
                            </defs>
                            <image id="I_P1_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="250" height="250" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P1_T0" x="913.5852766452272" y="306.7215394910918" font-size="23.220000000000002" class="inner_para4" xml:space="preserve">[1]</text>
                            <text id="I_P1_T1_1" x="915.5852766452272" y="358.06403949109176" font-size="46.440000000000005" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P1_T1_2" x="913.5852766452272" y="356.06403949109176" font-size="46.440000000000005" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P1_T2" x="913.5852766452272" y="390.8940394910918" font-size="29.025000000000002" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P1_T3" x="913.5852766452272" y="420.7483252053775" font-size="19.35" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P1_T4" x="913.5852766452272" y="443.7840394910918" font-size="15.48" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 1】，长按拖动</title>
                            <rect id="I_P1_T5_2" x="115" y="217" rx="0" width="25" height="20" class="inner_outer_para_edit1" />
                            <text id="I_P1_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(1);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(1);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(1);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P1_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(1);" onmouseout="this.style.fill='#888888'; deHighLightBubble(1);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_2" class="inner_para1">
                    <svg id="SVG_2" style="background-color:none;">

                        <g id="INNER_PARA_2" onclick="" onmouseover="highLightBubble(2);" onmouseout="deHighLightBubble(2);" style="cursor:default;">
                            <circle id="CR_2_1" cx="180.8434771494048" cy="615.6530228658521" r="109.64999999999999" class="inner_para2"></circle>
                            <circle id="CR_2_2" cx="175.8434771494048" cy="610.6530228658521" r="109.64999999999999" class="inner_para3"></circle>
                            <circle id="CR_2_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P2_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="235" height="235" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P2_T0" x="195.8434771494048" y="572.1217728658521" font-size="21.93" class="inner_para4" xml:space="preserve">[2]</text>
                            <text id="I_P2_T1_1" x="197.8434771494048" y="620.723022865852" font-size="43.86" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P2_T1_2" x="195.8434771494048" y="618.723022865852" font-size="43.86" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P2_T2" x="195.8434771494048" y="651.618022865852" font-size="27.412499999999998" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P2_T3" x="195.8434771494048" y="679.8137371515663" font-size="18.275" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P2_T4" x="195.8434771494048" y="701.5696895325187" font-size="14.62" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 2】，长按拖动</title>
                            <rect id="I_P2_T5_2" x="110" y="206" rx="0" width="23" height="18" class="inner_outer_para_edit1" />
                            <text id="I_P2_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(2);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(2);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(2);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P2_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(2);" onmouseout="this.style.fill='#888888'; deHighLightBubble(2);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_3" class="inner_para1">
                    <svg id="SVG_3" style="background-color:none;">

                        <g id="INNER_PARA_3" onclick="" onmouseover="highLightBubble(3);" onmouseout="deHighLightBubble(3);" style="cursor:default;">
                            <circle id="CR_3_1" cx="1185.0350621965156" cy="566.9957267194883" r="96.75" class="inner_para2"></circle>
                            <circle id="CR_3_2" cx="1180.0350621965156" cy="561.9957267194883" r="96.75" class="inner_para3"></circle>
                            <circle id="CR_3_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P3_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="205" height="205" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P3_T0" x="1180.0350621965156" y="501.5269767194883" font-size="19.35" class="inner_para4" xml:space="preserve">[3]</text>
                            <text id="I_P3_T1_1" x="1182.0350621965156" y="544.6457267194883" font-size="38.7" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P3_T1_2" x="1180.0350621965156" y="542.6457267194883" font-size="38.7" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P3_T2" x="1180.0350621965156" y="571.6707267194884" font-size="24.1875" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P3_T3" x="1180.0350621965156" y="596.5492981480597" font-size="16.125" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P3_T4" x="1180.0350621965156" y="615.7457267194883" font-size="12.899999999999999" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 3】，长按拖动</title>
                            <rect id="I_P3_T5_2" x="98" y="183" rx="0" width="21" height="16" class="inner_outer_para_edit1" />
                            <text id="I_P3_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(3);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(3);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(3);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P3_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(3);" onmouseout="this.style.fill='#888888'; deHighLightBubble(3);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_4" class="inner_para1">
                    <svg id="SVG_4" style="background-color:none;">

                        <g id="INNER_PARA_4" onclick="" onmouseover="highLightBubble(4);" onmouseout="deHighLightBubble(4);" style="cursor:default;">
                            <circle id="CR_4_1" cx="314.7230221703111" cy="443.51556762634834" r="90.3" class="inner_para2"></circle>
                            <circle id="CR_4_2" cx="309.7230221703111" cy="438.51556762634834" r="90.3" class="inner_para3"></circle>
                            <circle id="CR_4_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P4_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="190" height="190" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P4_T0" x="309.7230221703111" y="382.07806762634834" font-size="18.06" class="inner_para4" xml:space="preserve">[4]</text>
                            <text id="I_P4_T1_1" x="311.7230221703111" y="422.4555676263483" font-size="36.12" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P4_T1_2" x="309.7230221703111" y="420.4555676263483" font-size="36.12" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P4_T2" x="309.7230221703111" y="447.5455676263483" font-size="22.575" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P4_T3" x="309.7230221703111" y="470.76556762634834" font-size="15.049999999999999" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P4_T4" x="309.7230221703111" y="488.682234293015" font-size="12.04" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 4】，长按拖动</title>
                            <rect id="I_P4_T5_2" x="92" y="172" rx="0" width="19" height="15" class="inner_outer_para_edit1" />
                            <text id="I_P4_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(4);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(4);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(4);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P4_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(4);" onmouseout="this.style.fill='#888888'; deHighLightBubble(4);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_5" class="inner_para1">
                    <svg id="SVG_5" style="background-color:none;">

                        <g id="INNER_PARA_5" onclick="" onmouseover="highLightBubble(5);" onmouseout="deHighLightBubble(5);" style="cursor:default;">
                            <circle id="CR_5_1" cx="854.1459520140091" cy="704.4683700417525" r="83.85000000000001" class="inner_para2"></circle>
                            <circle id="CR_5_2" cx="849.1459520140091" cy="699.4683700417525" r="83.85000000000001" class="inner_para3"></circle>
                            <circle id="CR_5_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P5_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="175" height="175" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P5_T0" x="849.1459520140091" y="647.0621200417525" font-size="16.77" class="inner_para4" xml:space="preserve">[5]</text>
                            <text id="I_P5_T1_1" x="851.1459520140091" y="684.6983700417525" font-size="33.54" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P5_T1_2" x="849.1459520140091" y="682.6983700417525" font-size="33.54" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P5_T2" x="849.1459520140091" y="707.8533700417524" font-size="20.962500000000002" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P5_T3" x="849.1459520140091" y="729.414798613181" font-size="13.975" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P5_T4" x="849.1459520140091" y="746.0517033750857" font-size="11.18" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 5】，长按拖动</title>
                            <rect id="I_P5_T5_2" x="87" y="160" rx="0" width="17" height="14" class="inner_outer_para_edit1" />
                            <text id="I_P5_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(5);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(5);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(5);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P5_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(5);" onmouseout="this.style.fill='#888888'; deHighLightBubble(5);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_6" class="inner_para1">
                    <svg id="SVG_6" style="background-color:none;">

                        <g id="INNER_PARA_6" onclick="" onmouseover="highLightBubble(6);" onmouseout="deHighLightBubble(6);" style="cursor:default;">
                            <circle id="CR_6_1" cx="441.54022587465755" cy="660.0072064353187" r="77.39999999999999" class="inner_para2"></circle>
                            <circle id="CR_6_2" cx="436.54022587465755" cy="655.0072064353187" r="77.39999999999999" class="inner_para3"></circle>
                            <circle id="CR_6_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P6_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="160" height="160" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P6_T0" x="436.54022587465755" y="606.6322064353187" font-size="15.48" class="inner_para4" xml:space="preserve">[6]</text>
                            <text id="I_P6_T1_1" x="438.54022587465755" y="641.5272064353187" font-size="30.96" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P6_T1_2" x="436.54022587465755" y="639.5272064353187" font-size="30.96" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P6_T2" x="436.54022587465755" y="662.7472064353187" font-size="19.349999999999998" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P6_T3" x="436.54022587465755" y="682.650063578176" font-size="12.9" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P6_T4" x="436.54022587465755" y="698.0072064353187" font-size="10.319999999999999" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 6】，长按拖动</title>
                            <rect id="I_P6_T5_2" x="81" y="149" rx="0" width="16" height="13" class="inner_outer_para_edit1" />
                            <text id="I_P6_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(6);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(6);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(6);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P6_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(6);" onmouseout="this.style.fill='#888888'; deHighLightBubble(6);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_7" class="inner_para1">
                    <svg id="SVG_7" style="background-color:none;">

                        <g id="INNER_PARA_7" onclick="" onmouseover="highLightBubble(7);" onmouseout="deHighLightBubble(7);" style="cursor:default;">
                            <circle id="CR_7_1" cx="1214.2204871047222" cy="341.11031093341694" r="70.95" class="inner_para2"></circle>
                            <circle id="CR_7_2" cx="1209.2204871047222" cy="336.11031093341694" r="70.95" class="inner_para3"></circle>
                            <circle id="CR_7_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P7_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="145" height="145" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P7_T0" x="1209.2204871047222" y="291.76656093341694" font-size="14.190000000000001" class="inner_para4" xml:space="preserve">[7]</text>
                            <text id="I_P7_T1_1" x="1211.2204871047222" y="323.92031093341694" font-size="28.380000000000003" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P7_T1_2" x="1209.2204871047222" y="321.92031093341694" font-size="28.380000000000003" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P7_T2" x="1209.2204871047222" y="343.20531093341697" font-size="17.7375" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P7_T3" x="1209.2204871047222" y="361.44959664770266" font-size="11.825000000000001" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P7_T4" x="1209.2204871047222" y="375.52697760008357" font-size="9.46" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 7】，长按拖动</title>
                            <rect id="I_P7_T5_2" x="75" y="136" rx="0" width="15" height="13" class="inner_outer_para_edit1" />
                            <text id="I_P7_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(7);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(7);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(7);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P7_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(7);" onmouseout="this.style.fill='#888888'; deHighLightBubble(7);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_8" class="inner_para1">
                    <svg id="SVG_8" style="background-color:none;">

                        <g id="INNER_PARA_8" onclick="" onmouseover="highLightBubble(8);" onmouseout="deHighLightBubble(8);" style="cursor:default;">
                            <circle id="CR_8_1" cx="699.6639435087537" cy="721.1943786841065" r="64.5" class="inner_para2"></circle>
                            <circle id="CR_8_2" cx="694.6639435087537" cy="716.1943786841065" r="64.5" class="inner_para3"></circle>
                            <circle id="CR_8_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P8_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="130" height="130" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P8_T0" x="694.6639435087537" y="675.8818786841065" font-size="12.9" class="inner_para4" xml:space="preserve">[8]</text>
                            <text id="I_P8_T1_1" x="696.6639435087537" y="705.2943786841065" font-size="25.8" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P8_T1_2" x="694.6639435087537" y="703.2943786841065" font-size="25.8" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P8_T2" x="694.6639435087537" y="722.6443786841065" font-size="16.125" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P8_T3" x="694.6639435087537" y="739.2300929698208" font-size="10.75" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P8_T4" x="694.6639435087537" y="752.0277120174399" font-size="8.6" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 8】，长按拖动</title>
                            <rect id="I_P8_T5_2" x="69" y="125" rx="0" width="14" height="12" class="inner_outer_para_edit1" />
                            <text id="I_P8_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(8);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(8);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(8);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P8_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(8);" onmouseout="this.style.fill='#888888'; deHighLightBubble(8);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_9" class="inner_para1">
                    <svg id="SVG_9" style="background-color:none;">

                        <g id="INNER_PARA_9" onclick="" onmouseover="highLightBubble(9);" onmouseout="deHighLightBubble(9);" style="cursor:default;">
                            <circle id="CR_9_1" cx="137.68466875524877" cy="422.34840565591145" r="58.050000000000004" class="inner_para2"></circle>
                            <circle id="CR_9_2" cx="132.68466875524877" cy="417.34840565591145" r="58.050000000000004" class="inner_para3"></circle>
                            <circle id="CR_9_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P9_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="116" height="116" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P9_T0" x="132.68466875524877" y="381.06715565591145" font-size="11.610000000000001" class="inner_para4" xml:space="preserve">[9]</text>
                            <text id="I_P9_T1_1" x="134.68466875524877" y="407.73840565591144" font-size="23.220000000000002" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P9_T1_2" x="132.68466875524877" y="405.73840565591144" font-size="23.220000000000002" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P9_T2" x="132.68466875524877" y="423.15340565591146" font-size="14.512500000000001" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P9_T3" x="132.68466875524877" y="438.0805485130543" font-size="9.675" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P9_T4" x="132.68466875524877" y="449.59840565591145" font-size="7.74" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 9】，长按拖动</title>
                            <rect id="I_P9_T5_2" x="63" y="113" rx="0" width="13" height="11" class="inner_outer_para_edit1" />
                            <text id="I_P9_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(9);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(9);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(9);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P9_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(9);" onmouseout="this.style.fill='#888888'; deHighLightBubble(9);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_10" class="inner_para1">
                    <svg id="SVG_10" style="background-color:none;">

                        <g id="INNER_PARA_10" onclick="" onmouseover="highLightBubble(10);" onmouseout="deHighLightBubble(10);" style="cursor:default;">
                            <circle id="CR_10_1" cx="1112.7908783027272" cy="391.1300565895247" r="45.15" class="inner_para2"></circle>
                            <circle id="CR_10_2" cx="1107.7908783027272" cy="386.1300565895247" r="45.15" class="inner_para3"></circle>
                            <circle id="CR_10_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P10_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="86" height="86" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P10_T0" x="1107.7908783027272" y="357.9113065895247" font-size="9.03" class="inner_para4" xml:space="preserve">[10]</text>
                            <text id="I_P10_T1_1" x="1109.7908783027272" y="379.1000565895247" font-size="18.06" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P10_T1_2" x="1107.7908783027272" y="377.1000565895247" font-size="18.06" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P10_T2" x="1107.7908783027272" y="390.6450565895247" font-size="11.2875" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P10_T3" x="1107.7908783027272" y="402.2550565895247" font-size="7.5249999999999995" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P10_T4" x="1107.7908783027272" y="411.213389922858" font-size="6.02" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 10】，长按拖动</title>
                            <rect id="I_P10_T5_2" x="51" y="90" rx="0" width="12" height="10" class="inner_outer_para_edit1" />
                            <text id="I_P10_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(10);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(10);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(10);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P10_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(10);" onmouseout="this.style.fill='#888888'; deHighLightBubble(10);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_11" class="inner_para1">
                    <svg id="SVG_11" style="background-color:none;">

                        <g id="INNER_PARA_11" onclick="" onmouseover="highLightBubble(11);" onmouseout="deHighLightBubble(11);" style="cursor:default;">
                            <circle id="CR_11_1" cx="124.10984827300052" cy="288.1402915153433" r="38.699999999999996" class="inner_para2"></circle>
                            <circle id="CR_11_2" cx="119.10984827300052" cy="283.1402915153433" r="38.699999999999996" class="inner_para3"></circle>
                            <circle id="CR_11_3" class="bubble-block-dynamic-rainbow"></circle>
                            <image id="I_P11_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="72" height="72" clip-path="url(#circleClip)" style="display: none;" />
                            <text id="I_P11_T0" x="119.10984827300052" y="258.9527915153433" font-size="7.74" class="inner_para4" xml:space="preserve">[11]</text>
                            <text id="I_P11_T1_1" x="121.10984827300052" y="277.40029151534327" font-size="15.48" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P11_T1_2" x="119.10984827300052" y="275.40029151534327" font-size="15.48" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P11_T2" x="119.10984827300052" y="287.0102915153433" font-size="9.674999999999999" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P11_T3" x="119.10984827300052" y="296.96172008677183" font-size="6.45" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P11_T4" x="119.10984827300052" y="304.6402915153433" font-size="5.159999999999999" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【内部序参量 11】，长按拖动</title>
                            <rect id="I_P11_T5_2" x="45" y="78" rx="0" width="11" height="9" class="inner_outer_para_edit1" />
                            <text id="I_P11_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(11);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(11);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(11);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P11_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(11);" onmouseout="this.style.fill='#888888'; deHighLightBubble(11);">»»»</text>
                        </g>

                    </svg>
                </div>

                <div id="DIV_IN_0" class="inner_para1">
                    <svg id="SVG_0" style="background-color:none;">

                        <g id="SYS_ATTRACTOR" onclick="" onmouseover="highLightBubble(0);" onmouseout="deHighLightBubble(0);" style="cursor:default;">
                            <circle id="CR_0_1" cx="5" cy="5" r="129" class="inner_para2"></circle>
                            <circle id="CR_0_2" cx="0" cy="0" r="129" class="inner_para3"></circle>
                            <circle id="CR_0_3" class="bubble-block-dynamic-rainbow"></circle>
                            <defs>
                                <!-- 此处必须单独定义，否则在渐进播放时出错，表现：如果此泡泡带有图片，在从概述跳到吸引子（即此泡泡）时，圆形剪裁失效。在此单独定义后，故障解除 -->
                                <clipPath id="circleClip0" clipPathUnits="objectBoundingBox">
                                    <circle cx="0.5" cy="0.5" r="0.43" />
                                </clipPath>
                            </defs>
                            <image id="I_P0_PIC" preserveAspectRatio="xMidYMid slice" x="0" y="0" width="280" height="280" clip-path="url(#circleClip0)" style="display: none;" />
                            <text id="I_P0_T0" x="630.5" y="377.375" font-size="43" fill="#FF0000" stroke="#FFDDDD" stroke-width="1" text-anchor="middle" xml:space="preserve" font-weight="bold">@</text>
                            <text id="I_P0_T1_1" x="632.5" y="434.2" font-size="51.6" class="inner_para5" xml:space="preserve"></text>
                            <text id="I_P0_T1_2" x="630.5" y="432.2" font-size="51.6" class="inner_para4" xml:space="preserve"></text>
                            <text id="I_P0_T2" x="630.5" y="470.9" font-size="32.25" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P0_T3" x="630.5" y="504.07142857142856" font-size="21.5" class="inner_para6" xml:space="preserve"></text>
                            <text id="I_P0_T4" x="630.5" y="529.6666666666667" font-size="17.2" class="inner_para6" xml:space="preserve"></text>
                        </g>

                        <g>
                            <title>编辑【系统吸引子 @】，长按拖动</title>
                            <rect id="I_P0_T5_2" x="127" y="240" rx="0" width="27" height="22" class="inner_outer_para_edit1" />
                            <text id="I_P0_T5" class="inner_outer_para_edit2" xml:space="preserve" onclick="editInnerPara(0);" onmouseover="this.style.fill='#FFFFFF'; $(this.id + '_2').style.fillOpacity='100'; highLightBubble(0);" onmouseout="this.style.fill='#888888'; $(this.id + '_2').style.fillOpacity='0'; deHighLightBubble(0);">...</text>
                        </g>

                        <g>
                            <title>打开【链接】：2种方式：①鼠标或触屏【点击】本图元；②播放到当前位置时，按【回车】，或者，连按2次【右箭头】或【下一页】或 翻页笔【下一页】</title>
                            <text id="I_P0_LM" class="inner_outer_para_edit3" onmouseover="this.style.fill='#FF0000'; highLightBubble(0);" onmouseout="this.style.fill='#888888'; deHighLightBubble(0);">»»»</text>
                        </g>

                    </svg>
                </div>
                <!--  -->
                <!--  -->
                <!--================================== 下面是页脚，用于标注版权信息、备注等 =======================================-->
                <div id="DIV_FOOTER" style="position: absolute; left:80px; background-color:#DDDDDD; clear:both; font-size:16px; text-align:center; z-index:2000;">
                    <span id="AUTHOR_DATE" style="cursor:default; color:#000000;"
                          onmouseover="this.style.color='#FF5500';"
                          onmouseout="this.style.color='#000000';"></span>
                    <a href="http://www.holomind.com.cn" target="_blank" style="text-decoration:none" title="进入【在线制作】及获取【最新版本】"><span id="SUPPORT_INFO" style="color:#000000;" onmouseover="this.style.color='#FF5500';" onmouseout="this.style.color='#000000';">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;制作支持：阿色全息脑图系统 AHMM: Arthur's Holographic Mind Map &nbsp;&nbsp;&nbsp;&nbsp;在线制作及获取最新版本: www.holomind.com.cn</span></a>
                    <span id="AUTHOR_DATE3" title="编辑【页脚（版权信息、备注等）】" class="unselectable" style="cursor:text; color:#666666;"
                          onclick="editAuthor();"
                          onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000'; $('AUTHOR_DATE').style.color='#FF5500'; $('SUPPORT_INFO').style.color='#FF5500';"
                          onmouseout="this.style.color='#888888'; this.style.backgroundColor='rgba(255,255,255,0)'; $('AUTHOR_DATE').style.color='#000000'; $('SUPPORT_INFO').style.color='#000000';">...</span>
                </div>
            </div> <!-- <div  id="DIV_WHOLE_CANVAS">结束 -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--====================================================  整个绘图区的 SVG 结束 =========================================================-->
            <!--===================================== 包括LOGO、标题、内部序参量泡泡、外部关联参量块块、页脚 ===========================================-->
            <!--==================================== 上面是svg 框架文本，它内部的一些数据由js 修改形成最终html ========================================-->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--=============================================== 下面是用于编辑等互操作的窗口、菜单等  ================================================-->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            
            <!--  -->
            <!--  -->
            <!--  -->
            <!--====================================== 下面是显示概述信息的窗口 ========================================-->
            <div id="GEN_WORDS_BOX" style="display: block; left: 150px; top: 200px; width: 1160px; font-size: 32px; text-align:justify; background-color: #FFFFFF; border: 1px; opacity: 1; cursor: default; z-index: 2000; transition: transform 0.3s ease-in-out; transform-origin: 0 0;" class="show_box_20"
                 onmouseover="highLightGenWords();"
                 onmouseout="deHighLightGenWords();">
                <!-- 概述框内的小标题 -->
                <svg id="GEN_WORDS_SVG" width="40" height="60">
                    <rect stroke-width="0" height="50" width="10" y="5" x="5" stroke="#000" fill="#DDDDDD" filter="url(#SHADOW2)" />
                    <rect stroke-width="0" height="50" width="10" y="0" x="0" stroke="#000" fill="#666666" />
                    <text id="GEN_WORDS_TITLE" xml:space="preserve" text-anchor="start" font-size="40" font-weight="bold" y="40" x="15" stroke-width="0" stroke="#000" fill="#000000"></text>
                </svg>
                <span id="GEN_WORDS_TEXT"></span>
                <span id="GEN_WORDS_TEXT2" title="编辑【概述】" class="unselectable" style="cursor:text; position: absolute; left:1160px; top:0px; color:#666666; font-size:25px;"
                      onclick="editGenWords();"
                      onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000'; "
                      onmouseout="this.style.color='#888888'; this.style.backgroundColor='rgba(255,255,255,0)';">...</span>
            </div>
            <!--  -->
            <!--  -->
            <!--==================================== 下面是显示操作向导信息的窗口 ======================================-->
            <div id="GUIDE_INFO_BOX" onclick="hideShowGuideInfo();" style="display: block; padding-left: 20px; padding-right: 20px; padding-top: 0px; padding-bottom: 0px; position: absolute; left: 500px; top: 120px; font-size: 32px; text-align: justify; background-color: none; border: 0px; opacity: 0.95; z-index: 8950; ">
                <svg height="670" width="820">
                    <!-- 绘制操作向导的SVG -->

                    <polygon points="0,50 0,650 800,650 800,50" style="fill:#666666; stroke:#FFFFFF; stroke-width:0" filter="url(#GUIDE_SHADOW);" />
                    <rect id="CLOSE_X" x="690" y="51" width="59" height="31" stroke-width="0" stroke="#000" fill="#333333" onclick="hideShowGuideInfo();" style="cursor:pointer;" onmouseover="$('CLOSE_X').style.fill='#AA0000';" onmouseout="$('CLOSE_X').style.fill='#333333';" />
                    <text x="709" y="75" font-size="24" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="lighter" onclick="hideShowGuideInfo();" title="关闭向导" style="cursor:pointer;" onmouseover="$('CLOSE_X').style.fill='#AA0000';" onmouseout="$('CLOSE_X').style.fill='#333333';">✕</text>
                    <text x="305" y="120" font-size="48" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">操作向导</text>

                    <text id="ON_PC" style="display:block;" x="520" y="120" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">（电脑端）</text>

                    <text id="ON_MOBILEDEVICE" style="display:none;" x="520" y="120" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">（移动设备端）</text>

                    <g id="GUIDE_FOR_PC" style="display:block;">
                        <text x="40" y="180" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第一步:【+标题】</text>
                        <text x="350" y="180" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">点击“标题”后【...】，设置标题，它</text>
                        <text x="160" y="220" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">将作为存档文件名使用。点击各个【...】编辑脑图。</text>

                        <text x="40" y="280" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第二步:【保存脑图】</text>
                        <text x="400" y="280" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">随时按&lt;</text>
                        <text x="490" y="280" font-size="24" fill="#FF0000" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">Ctrl+S</text>
                        <text x="567" y="280" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">&gt;键（苹果电脑为</text>
                        <text x="160" y="320" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">Command+S）或浏览器【保存网页】，保存脑图文件。</text>

                        <text x="40" y="380" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第三步:【再次编辑】</text>
                        <text x="400" y="380" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">文件夹中打开已保存的文件继续编</text>
                        <text x="160" y="420" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">辑。及时按&lt;Ctrl+S&gt;保存。原ahmm.html已无关。</text>

                        <text x="40" y="480" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第四步:【播放脑图】</text>
                        <text x="400" y="480" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">点击【▸】播放，再点击屏幕右上</text>
                        <text x="160" y="520" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">角红色【...】返回编辑。支持键盘、翻页笔和触屏。</text>
                    </g>

                    <g id="GUIDE_FOR_MOBILEDEVICE" style="display:none;">
                        <text x="40" y="180" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第一步:【+标题】</text>
                        <text x="350" y="180" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">点击“标题”后【...】，设置标题，它</text>
                        <text x="160" y="220" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">将作为存档文件名使用。点击各个【...】编辑脑图。</text>

                        <text x="40" y="280" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第二步:【保存脑图】</text>
                        <text x="395" y="280" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">随时按菜单【≚】【保存全息脑图】</text>
                        <text x="160" y="320" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">【保存/下载】功能，保存（下载）新建的脑图文件。</text>

                        <text x="40" y="380" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第三步:【再次编辑】</text>
                        <text x="400" y="380" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">在【下载内容】中打开已保存的文</text>
                        <text x="160" y="420" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">件继续编辑，编号最大者为最新。注意及时保存。</text>

                        <text x="40" y="480" font-size="36" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">第四步:【播放脑图】</text>
                        <text x="400" y="480" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">点击【▸】播放，再点击屏幕右上</text>
                        <text x="160" y="520" font-size="24" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="bold">角红色闪烁【...】返回编辑。支持键盘、翻页笔和触屏。</text>
                    </g>

                    <line id="LN0" x1="0" y1="550" x2="800" y2="550" stroke-width="1" fill="#FFFF00" stroke="#FFFF00"></line>

                    <text x="50" y="590" font-size="26" fill="#FFFF00" stroke="#FFFF00" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="lighter">★</text>
                    <text x="80" y="590" font-size="20" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="lighter">①点击【≚】进入功能菜单。②链接的所有文件应置于同一文件夹，可打包成</text>
                    <text x="80" y="620" font-size="20" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="0" text-anchor="start" xml:space="preserve" font-weight="lighter">zip/rar发布。③某些浏览器具有保存为【PDF】或【图片】的功能。</text>

                    <defs>
                        <filter id="GUIDE_SHADOW" x="0" y="0" width="200%" height="200%">
                            <feOffset result="offOut" in="SourceGraphic" dx="5" dy="5" />
                            <feGaussianBlur result="blurOut" in="offOut" stdDeviation="5" />
                            <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
                        </filter>
                    </defs>

                </svg>
            </div> <!-- <div id="GUIDE_INFO_BOX"> 结束 -->
            <!--  -->
            <!--  -->
            <!--============================= 下面是编辑内部序参量各个主题词的信息的窗口 ===============================-->
            <div id="EDIT_INNER_PARA_BOX" class="edit_box1" style="left: 400px; top: 190px; width: 670px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditInnerPara();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h1>编辑全息</h1>
                <h2><span id="CURRENT_INNER_ORDER_TYPE">内部序参量@</span></h2>

                <form name="edit_inner_para" onkeydown="if(event.keyCode==13){changeInnerPara();}">
                    <!-- 不修改 -->
                    <table border="0" style="font-size: 22px;">
                        <tr>
                            <td style="width: 120px; text-align: justify; text-align-last: justify; vertical-align: middle;">参量序号&nbsp;</td>
                            <td style="width: 20px; text-align: left; vertical-align: middle;"><span id="CURRENT_INNER_ORDER_NO">@</span></td>
                            <td style="width: 260px; text-align: right; vertical-align: middle;">
                                <span id="ADJUST_INNER_ORDER_TEXT">调整排序&nbsp;&nbsp;</span>
                            </td>
                            <td colspan="2" style="width: 10px; text-align: left; vertical-align: middle;">
                                <div style="display: flex; ">
                                    <!-- 必须使用<div> flex，否则下面两个button不在同一行 -->
                                    <button id="dec_inner_order_no" type="button" class="button_size_4" onclick="decreaseInnerOrderNo();">◀</button>
                                    <button id="inc_inner_order_no" type="button" class="button_size_4" onclick="increaseInnerOrderNo();">▶</button>
                                </div>
                            </td>
                            <td id="NOW_WORKS" style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;调整即时生效</td>
                        </tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">标&nbsp;&nbsp;&nbsp;&nbsp;签&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="inner_tag_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_tag_words');" /></td><td style="width: 180px; text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于5字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">主&nbsp;题&nbsp;词&nbsp;</td><td colspan="4" style="text-align: left;"><input type="text" id="inner_core_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_core_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于5字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">关键信息&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="inner_key_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_key_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于8字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">主要信息&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="inner_main_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_main_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于12字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">一般信息&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="inner_plain_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_plain_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于15字</td></tr>
                        <tr>
                            <td style="text-align: justify; text-align-last: justify; vertical-align: middle;">链接信息&nbsp;<br /><span style="font-size:16px;">（可多个）</span>&nbsp;</td>
                            <td colspan="4" style="text-align: left; vertical-align:middle; padding-top:6px;">
                                <textarea rows="5" cols="50" id="inner_add_url" style="resize: vertical; width: 362px;" onclick="getFocus('inner_add_url');"></textarea>
                            </td>
                            <td style="text-align: justify; vertical-align: middle;">
                                &nbsp;+ <input type="file" id="inner_add_url_t" onclick="getFocus('inner_add_url');" onchange="getLinkFilePlus('inner_add_url_t', 'inner_add_url', value);" style="opacity: 1; width: 72px;"> <!-- 缩短宽度，切掉“选择文件”这四个文字 -->
                                <br />&nbsp;<input type="checkbox" id="inner_add_url_sw" style="height:12px;" onclick="getFocus('inner_add_url');" />
                                <span style="font-size:16px;">新标签页打开</span>
                                <br />&nbsp;<input type="checkbox" id="inner_add_url_af" style="height:12px;" onclick="getFocus('inner_add_url');" />
                                <span style="font-size:16px;">保持原始尺寸</span>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: justify; text-align-last: justify; vertical-align: middle;">背景图片&nbsp;</td>
                            <td colspan="4" style="text-align: left; vertical-align: middle;">
                                <input type="text" id="inner_back_pic" class="input_text" size=36 style="width: 360px;" onclick="getFocus('inner_back_pic');" />
                            </td>
                            <td style="text-align: justify; vertical-align: middle;">
                                &nbsp;+ <input type="file" id="inner_back_pic_t" accept="image/*" onclick="getFocus('inner_back_pic');" onchange="getLinkFile('inner_back_pic_t', 'inner_back_pic', value);" style="opacity: 1; width: 72px;"> <!-- 缩短宽度，切掉“选择文件”这四个文字 -->
                            </td>
                        </tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">缩放比例&nbsp;</td><td colspan="5" style="text-align: left; vertical-align: middle;"><input type="text" id="inner_scale" class="input_text" size=6 onclick="getFocus('inner_scale');" /><span style="font-size:16px;">&nbsp;&nbsp;&nbsp;0至3之间，默认为1。超出值：最大取3、最小取0</span></td></tr>
                        <tr>
                            <td colspan="6" style="text-align: left;">
                                <h4>
                                    【链接信息】：图片、文档等各种本地文件或网上链接（含http://）；多个时，以空格分隔<br />
                                    【选择文件】：选择本地或网上文件，应与本脑图文件处于相同文件夹<br />
                                    【新标签页打开】：系统安全限制：某些网站必须使用新标签页；只允许打开第1个链接，其他忽略
                                </h4>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="6" style="text-align: center;">
                                <button id="inner_change_info" type="button" class="button_size_2" onclick="changeInnerPara();">
                                    确认修改
                                </button>
                                <button id="inner_clear_info" type="button" class="button_size_2" onclick="clearInnerPara();">
                                    清除信息
                                </button>
                                <button id="inner_hide" type="button" class="button_size_2" onclick="hideInnerPara();">
                                    隐藏
                                </button>
                                <button id="inner_cancel" type="button" class="button_size_2" onclick="hideEditInnerPara();">
                                    返回
                                </button>
                                <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                            </td>
                        </tr>
                    </table>
                </form>
            </div> <!-- <div id="EDIT_INNER_PARA_BOX"> 结束 -->
            <!--  -->
            <!--  -->
            <!--============================ 下面是编辑外部关联参量各个关联词的信息的窗口 ==============================-->
            <div id="EDIT_OUTER_PARA_BOX" class="edit_box1" style="left: 600px; top: 220px; width: 670px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditOuterPara();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h1>编辑全息</h1>
                <h2>外部关联参量</h2>

                <form name="edit_outer_para" onkeydown="if(event.keyCode==13){changeOuterPara();}">
                    <!-- 不修改 -->
                    <table border="0" style="font-size: 22px;">
                        <tr>
                            <td style="width: 120px; text-align: justify; text-align-last: justify; vertical-align: middle;">参量序号&nbsp;</td>
                            <td style="width: 20px; text-align: left; vertical-align: middle;"><span id="CURRENT_OUTER_ORDER_NO">1</span></td>
                            <td style="width: 260px; text-align: right; vertical-align: middle;">
                                <span id="ADJUST_OUTER_ORDER_TEXT">调整排序&nbsp;&nbsp;</span>
                            </td>
                            <td colspan="2" style="width: 10px; text-align: left; vertical-align: middle;">
                                <div style="display: flex; ">
                                    <!-- 必须使用<div> flex，否则下面两个button不在同一行 -->
                                    <button id="dec_outer_order_no" type="button" class="button_size_4" onclick="decreaseOuterOrderNo();">◀</button>
                                    <button id="inc_outer_order_no" type="button" class="button_size_4" onclick="increaseOuterOrderNo();">▶</button>
                                </div>
                            </td>
                            <td id="NOW_WORKS2" style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;调整即时生效</td>
                        </tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">标&nbsp;&nbsp;&nbsp;&nbsp;签&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="outer_tag_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('outer_tag_words');" /></td><td style="width: 180px; text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于8字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">关&nbsp;联&nbsp;词&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="outer_core_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('outer_core_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于8字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">关键信息&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="outer_key_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('outer_key_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于12字</td></tr>
                        <tr><td style="text-align: justify; text-align-last: justify; vertical-align: middle;">主要信息&nbsp;</td><td colspan="4" style="text-align: left; vertical-align: middle;"><input type="text" id="outer_main_words" class="input_text" size=36 style="width: 360px;" onclick="getFocus('outer_main_words');" /></td><td style="text-align: left; vertical-align: middle; font-size: 16px;">&nbsp;&nbsp;&nbsp;建议不多于16字</td></tr>
                        <tr>
                            <td style="text-align: justify; text-align-last: justify; vertical-align: middle;">链接信息&nbsp;<br /><span style="font-size:16px;">（可多个）</span>&nbsp;</td>
                            <td colspan="4" style="text-align: left; vertical-align: middle; padding-top: 6px;">
                                <textarea rows="5" cols="50" id="outer_add_url" style="resize: vertical; width: 362px;" onclick="getFocus('outer_add_url');"></textarea>
                            </td>
                            <td style="text-align: justify; vertical-align: middle;">
                                &nbsp;+ <input type="file" id="outer_add_url_t" onclick="getFocus('outer_add_url');" onchange="getLinkFilePlus('outer_add_url_t', 'outer_add_url', value);" style="opacity: 1; width: 72px;"> <!-- 缩短宽度，切掉选择文件文字 -->
                                <br />&nbsp;<input type="checkbox" id="outer_add_url_sw" style="height:12px;" onclick="getFocus('outer_add_url');" />
                                <span style="font-size:16px;">新标签页打开</span>
                                <br />&nbsp;<input type="checkbox" id="outer_add_url_af" style="height:12px;" onclick="getFocus('outer_add_url');" />
                                <span style="font-size:16px;">保持原始尺寸</span>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: justify; text-align-last: justify; vertical-align: middle;">背景图片&nbsp;</td>
                            <td colspan="4" style="text-align: left; vertical-align: middle;">
                                <input type="text" id="outer_back_pic" class="input_text" size=36 style="width: 360px;" onclick="getFocus('outer_back_pic');" />
                            </td>
                            <td style="text-align: justify; vertical-align: middle;">
                                &nbsp;+ <input type="file" id="outer_back_pic_t" accept="image/*" onclick="getFocus('outer_back_pic');" onchange="getLinkFile('outer_back_pic_t', 'outer_back_pic', value);" style="opacity: 1; width: 72px;"> <!-- 缩短宽度，切掉“选择文件”这四个文字 -->
                            </td>
                        </tr>
                        <tr>
                            <td colspan="6" style="text-align: left;">
                                <h4>
                                    【链接信息】：图片、文档等各种本地文件或网上链接（含http://）；多个时，以空格分隔<br />
                                    【选择文件】：选择本地或网上文件，应与本脑图文件处于相同文件夹<br />
                                    【新标签页打开】：系统安全限制：某些网站必须使用新标签页；只允许打开第1个链接，其他忽略
                                </h4>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="6" style="text-align: center;">
                                <button id="outer_change_info" type="button" class="button_size_2" onclick="changeOuterPara();">
                                    确认修改
                                </button>
                                <button id="outer_clear_info" type="button" class="button_size_2" onclick="clearOuterPara();">
                                    清除信息
                                </button>
                                <button id="outer_cancel" type="button" class="button_size_2" onclick="hideEditOuterPara();">
                                    返回
                                </button>
                                <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                            </td>
                        </tr>
                    </table>
                </form>
            </div><!-- <div id="EDIT_OUTER_PARA_BOX"> 结束 -->
            <!--  -->
            <!--  -->
            <!--======================================= 下面是编辑Logo信息的窗口 =======================================-->
            <div id="EDIT_LOGO_BOX" class="edit_box1" style="left: 100px; top: 100px; width: 700px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditLogo();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>设置Logo</h2>
                <div align="center">
                    <form name="edit_logo" onkeydown="if(event.keyCode==13){changeLogo();}">
                        <!-- 不修改 -->
                        &nbsp;&nbsp;&nbsp;&nbsp;Logo图片&nbsp;&nbsp;&nbsp;<input type="text" id="logo_pic" class="input_text" size=40 onclick="getFocus('logo_pic');" />
                        <input type="file" id="logo_pic_t" accept="image/*" onclick="getFocus('logo_pic');" onchange="getLinkFile('logo_pic_t', 'logo_pic', value);" style="opacity: 1; width: 72px;"><br />
                        <div style="text-align: left; vertical-align: middle; padding-left:55px;">
                            <h4>
                                【Logo图片】自动缩放，建议宽度大于等于高度<br />
                                【Logo图片】文件应与本脑图文件处于相同文件夹，以便打包压缩<br />
                            </h4>
                        </div>
                        <button id="change_logo" type="button" class="button_size_2" onclick="changeLogo();">确认修改</button>
                        <button id="clear_logo" type="button" class="button_size_2" onclick="clearLogo();">清除信息</button>
                        <button id="logo_cancel" type="button" class="button_size_2" onclick="hideEditLogo();">取消/返回</button>
                        <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                        <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                        <input type="text" style="display:none" />
                    </form>
                </div>
            </div>
            <!--  -->
            <!--  -->
            <!--======================================= 下面是编辑背景图片/音乐信息的窗口 =======================================-->
            <div id="EDIT_BACK_PIC_MUSIC_BOX" class="edit_box1" style="left: 100px; top: 200px; width: 700px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditBackPicMusic();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>设置脑图背景图片/音乐</h2>
                <div align="center">
                    <form name="edit_back_pic" onkeydown="if(event.keyCode==13){changeBackPicMusic();}">
                        <!-- 不修改 -->
                        &nbsp;&nbsp;&nbsp;&nbsp;背景图片&nbsp;&nbsp;&nbsp;<input type="text" id="back_pic" class="input_text" size=40 onclick="getFocus('back_pic');" />
                        <input type="file" id="back_pic_t" accept="image/*" onclick="getFocus('back_pic');" onchange="getLinkFile('back_pic_t', 'back_pic', value);" style="opacity: 1; width: 72px;"><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;背景音乐&nbsp;&nbsp;&nbsp;<input type="text" id="back_music" class="input_text" size=40 onclick="getFocus('back_music');" />
                        <input type="file" id="back_music_t" accept="audio/*" onclick="getFocus('back_music');" onchange="getLinkFile('back_music_t', 'back_music', value);" style="opacity: 1; width: 72px;"><br />
                        <div style="text-align: left; vertical-align: middle; padding-left:55px;">
                            <h4>
                                【背景图片】自动剪裁充满，建议宽度大于等于高度<br />
                                【背景音乐】在播放脑图时播放，退出播放脑图时停止<br />
                                【背景图片/音乐】文件应与本脑图文件处于相同文件夹，以便打包压缩<br />
                            </h4>
                        </div>
                        <button id="change_back_pic_music" type="button" class="button_size_2" onclick="changeBackPicMusic();">确认修改</button>
                        <button id="clear_back_pic_music" type="button" class="button_size_2" onclick="clearBackPicMusic();">清除信息</button>
                        <button id="back_pic_music_cancel" type="button" class="button_size_2" onclick="hideEditBackPicMusic();">取消/返回</button>
                        <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                        <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                        <input type="text" style="display:none" />
                    </form>
                </div>
            </div>
            <!--  -->
            <!--  -->
            <!--======================================= 下面是编辑标题信息的窗口 =======================================-->
            <div id="EDIT_TITLE_BOX" class="edit_box1" style="left: 560px; top: 130px; width: 700px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditTitle();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>编辑标题、链接页、封面、封底信息 / 通用设置</h2>
                <div align="center">
                    <form name="edit_title" onkeydown="if(event.keyCode==13){changeTitle();}">
                        <!-- 不修改 -->
                        <table border="0" style="font-size: 22px;">
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    本脑图标题&nbsp;&nbsp;
                                </td>
                                <td colspan="2" style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="map_title" class="input_text" size=48 onclick="getFocus('map_title');" />
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    上一页链接&nbsp;&nbsp;
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="prev_page" class="input_text" size=38 onclick="getFocus('prev_page');" />
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="file" id="prev_page_t" onclick="getFocus('prev_page');" onchange="getLinkFile('prev_page_t', 'prev_page', value);" style="opacity: 1; width: 72px;"> <!-- 选择文件。缩短宽度，切掉选择文件文字 -->
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    下一页链接&nbsp;&nbsp;
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="next_page" class="input_text" size=38 onclick="getFocus('next_page');" />
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="file" id="next_page_t" onclick="getFocus('next_page');" onchange="getLinkFile('next_page_t', 'next_page', value);" style="opacity: 1; width: 72px;">
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    起始页链接&nbsp;&nbsp;
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="home_page" class="input_text" size=38 onclick="getFocus('home_page');" />
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="file" id="home_page_t" onclick="getFocus('home_page');" onchange="getLinkFile('home_page_t', 'home_page', value);" style="opacity: 1; width: 72px;">
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    封面页图片&nbsp;&nbsp;
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="face_cover" class="input_text" size=38 onclick="getFocus('face_cover');" />+
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="file" id="face_cover_t" accept="image/*" onclick="getFocus('face_cover');" onchange="getLinkFilePlus('face_cover_t', 'face_cover', value);" style="opacity: 1; width: 72px;">
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    封底页图片&nbsp;&nbsp;
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="text" id="back_cover" class="input_text" size=38 onclick="getFocus('back_cover');" />+
                                </td>
                                <td style="text-align: left; vertical-align: middle;">
                                    <input type="file" id="back_cover_t" accept="image/*" onclick="getFocus('back_cover');" onchange="getLinkFilePlus('back_cover_t', 'back_cover', value);" style="opacity: 1; width: 72px;">
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    主题词布局&nbsp;&nbsp;
                                </td>
                                <td colspan="3" style="text-align: left; vertical-align: middle;">
                                    <input type="checkbox" id="story_line" style="height: 12px;" /><span style="font-size:16px;">故事线模式：按顺序串行连接各个参量信息（默认为星形模式）</span>
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align: left; vertical-align: middle;">
                                    播放时设置&nbsp;&nbsp;
                                </td>
                                <td colspan="2" style="text-align: left; vertical-align: middle;">
                                    <input type="checkbox" id="sequential_play" style="height: 12px;" /><span style="font-size:16px;">渐进播放：按顺序显示各个参量信息&nbsp;&nbsp;&nbsp;&nbsp;</span>
                                    <input type="checkbox" id="time_display" style="height: 12px;" /><span style="font-size:16px;">播放时显示当前时间</span>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="3" style="text-align: left;">
                                    <h4>
                                        【本脑图标题】：支持HTML标记，如：回车=&lt;br&gt;、空格=&amp;nbsp;  等等；支持文本修饰，如：<br />
                                        &nbsp;&nbsp;&lt;span style='color: #AA0000; font-family: 楷体; font-size: 50px;'&gt全息脑图&lt;/span&gt<br />
                                        【链接/图片】：可以是本地文件，也可以是网上链接（包含http://的完全URL）<br />
                                        【选择文件】：选择本地文件/图片，该文件/图片应与本脑图文件处于相同文件夹<br />
                                        【封面/封底页图片】：可填加多个，以空格分隔；单个图片文件名中不能存在空格<br />
                                        &nbsp;&nbsp;* 图片将自动缩放，建议使用16:9高分图片，1920×1080最佳<br />
                                        &nbsp;&nbsp;* 链接页和封面/封底图片等文件应与本脑图文件处于相同文件夹，以便打包压缩
                                    </h4>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="3" style="text-align: center;">
                                    <button id="change_title" type="button" class="button_size_2" onclick="changeTitle();">确认修改</button>
                                    <button id="clear_title" type="button" class="button_size_2" onclick="clearTitle();">清除信息</button>
                                    <button id="title_cancel" type="button" class="button_size_2" onclick="hideEditTitle();">取消/返回</button>
                                    <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                                    <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                                    <input type="text" style="display:none" />
                                </td>
                            </tr>
                        </table>

                    </form>
                </div>
            </div>
            <!--  -->
            <!--  -->
            <!--======================================= 下面是编辑概述信息的窗口 =======================================-->
            <div id="EDIT_GEN_WORDS_BOX" class="edit_box1" style="width: 900px; white-space: nowrap;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditGenWords();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>编辑概述</h2>
                <form name="edit_gen_words">
                    概述内容<br />
                    <textarea id="gen_info" cols="68" rows="6" style="overflow: hidden;  width: 900px; height:160px; resize:none; font-size:24px;" size=100 onclick="getFocus('gen_info')"></textarea><br />
                    <div style="text-align: left; vertical-align: middle;">
                        <h4>
                            [&nbsp;&nbsp;&nbsp;]中的文字将作为概述的小标题显示<br />
                            支持HTML标记，如： 回车=&lt;br&gt;、空格=&amp;nbsp; &nbsp;&nbsp;&nbsp;等等<br />
                            支持文本修饰，如：&lt;span style='color: #AA0000; font-family: 楷体; font-size: 50px; font-weight: bold;'&gt全息脑图&lt;/span&gt<br />
                        </h4>
                    </div>
                    <button id="change_gen_words" type="button" class="button_size_2" onclick="changeGenWords();">确认修改</button>
                    <button id="clear_gen_words" type="button" class="button_size_2" onclick="clearGenWords();">清除信息</button>
                    <button id="gen_words_cancel" type="button" class="button_size_2" onclick="hideEditGenWords();">取消/返回</button>
                    <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                </form>
            </div>
            <!--  -->
            <!--  -->
            <!--================================ 下面是编辑页脚的作者、备注信息的窗口 ==================================-->
            <div id="EDIT_AUTHOR_BOX" class="edit_box1" style="left: 120px; width: 1500px;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditAuthor();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>编辑页脚标注（作者、日期、备注等）</h2>
                <form name="edit_author" onkeydown="if(event.keyCode==13){changeAuthor();}">
                    <!-- 不修改 -->
                    标注&nbsp;&nbsp;&nbsp;
                    <input type="text" id="copyright_info" class="input_text" size=140 onclick="getFocus('copyright_info');" /><br />
                    <input type="checkbox" id="hide_support_info" checked style="height:12px;" onclick="getFocus('hide_support_info');" /><span style="font-size:16px;">隐藏制作支持信息</span>
                    <div style="text-align: left; vertical-align: middle; padding-left:60px;">
                        <h4>
                            支持HTML标记，如： 回车=&lt;br&gt;、空格=&amp;nbsp; &nbsp;&nbsp;&nbsp;等等<br />
                            支持文本修饰，如：&lt;span style='color: #AA0000; font-family: 楷体; font-size: 20px; font-weight: bold;'&gt全息脑图&lt;/span&gt<br />
                        </h4>
                    </div>
                    <button id="change_author" type="button" class="button_size_2" onclick="changeAuthor();">确认修改</button>
                    <button id="clear_author" type="button" class="button_size_2" onclick="clearAuthor();">清除信息</button>
                    <button id="author_cancel" type="button" class="button_size_2" onclick="hideEditAuthor();">取消/返回</button>
                    <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                    <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                    <input type="text" style="display:none" />
                </form>
            </div>
            <!--  -->
            <!--  -->
            <!--=============================== 下面是编辑左侧内部序参量标签文字的窗口 =================================-->
            <div id="EDIT_IN_MARK_BOX" class="edit_box1" style="left: 150px;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditInMark();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>编辑左标签</h2>
                <form name="edit_in_mark" onkeydown="if(event.keyCode==13){changeInMark();}">
                    <!-- 不修改 -->
                    <input type="text" id="in_mark_text" class="input_text" size=30 onclick="getFocus('in_mark_text');" /><br />
                    <button id="change_in_mark" type="button" class="button_size_1" onclick="changeInMark();">确认修改</button>
                    <button id="clear_in_mark" type="button" class="button_size_1" onclick="clearInMark();">清除信息</button>
                    <button id="in_mark_cancel" type="button" class="button_size_1" onclick="hideEditInMark();">取消/返回</button>
                    <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                    <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                    <input type="text" style="display:none" />
                </form>
            </div>
            <!--  -->
            <!--  -->
            <!--=============================== 下面是编辑右侧外部关联参量标签文字的窗口 ===============================-->
            <div id="EDIT_OUT_MARK_BOX" class="edit_box1" style="left: 1360px;">
                <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                     onclick="hideEditOutMark();"
                     onmouseover="this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.backgroundColor='#666666';">✕</div>
                <br />
                <h2>编辑右标签</h2>
                <form name="edit_out_mark" onkeydown="if(event.keyCode==13){changeOutMark();}">
                    <!-- 不修改 -->
                    <input type="text" id="out_mark_text" class="input_text" size=30 onclick="getFocus('out_mark_text');" /><br />
                    <button id="change_out_mark" type="button" class="button_size_1" onclick="changeOutMark();">确认修改</button>
                    <button id="clear_out_mark" type="button" class="button_size_1" onclick="clearOutMark();">清除信息</button>
                    <button id="out_mark_cancel" type="button" class="button_size_1" onclick="hideEditOutMark();">取消/返回</button>
                    <br /><h3>*【确认修改】并未保存文件，请使用 &lt;Ctrl+S&gt; 或【保存/下载】功能永久保存</h3>
                    <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                    <input type="text" style="display:none" />
                </form>
            </div>
            <!--  -->
            <!--  -->
            <!--==================================== 下面是显示功能菜单的信息的窗口 ====================================-->
            <div id="FUNCTION_MENU_BOX" class="show_box_0" style="left: 1688px; top: 30px;">
                <form name="show_menu">
                    <button type="button" class="unselectable button_size_2" onclick="newAHMM();" 
                        title="【创建空白全息脑图】&#10;将在浏览器中打开一个新的窗口或&#10;标签页，原脑图会继续存在于原窗&#10;口或标签页。请注意使用<Ctrl+S>&#10;键保存。">
                        新建全息脑图
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="newAIAHMM();" 
                        title="【AI从网页或文本自动生成脑图】&#10;将连接互联网打开一个新的页面，&#10;选择从网页或用户自定义文本生成&#10;全息脑图。请注意使用<Ctrl+S>&#10;键保存。">
                        AI自动生成脑图
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="newAHMMCopy();" 
                        title="【基于本脑图创建新图】&#10;将在浏览器中打开一个新的窗口或&#10;标签页，并自动把当前脑图的数据&#10;复制到新建脑图中，新脑图的标题&#10;和基因ID将自动重新生成。原脑图&#10;会继续存在于原窗口或标签页。请&#10;注意使用<Ctrl+S>键保存。&#10; * 原脑图必须是已存盘的 html 文&#10;件，未存盘数据不能复制。">
                        复制当前脑图
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="saveAHMM();"
                        title="【保存当前脑图到HTML文件中】&#10;建议使用 <Ctr+S> 键保存，系统&#10;将根据当前脑图标题自动给出建议&#10;的文件名。保存类型需要使用&#10;【网页，全部(*.htm;*.html)】。&#10;如果换名保存，应重新打开新保存&#10;的文件继续编辑，备份除外。">
                        保存全息脑图
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="restoreEditHistory();"
                        title="【 Undo / Redo 】&#10;将编辑工作恢复到打开本文件之后&#10;的任一点。如果确定执行恢复，则&#10;按【确定】。 按 【返回/取消】则&#10;不执行恢复操作。">
                        恢复编辑历史
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="cleanAHMM();"
                        title="【删除当前脑图内容】&#10;清空后，脑图将变成完全空白。执&#10;行本操作后可恢复。">
                        清空脑图内容
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="resetAHMM();"
                        title="【重新布置主题词位置】&#10;在星形模式时，系统自动随机重新&#10;布置；在故事线模式时，系统按照&#10;预设的若干种形式自动对齐布置。&#10;执行本操作后可恢复。">
                        重排主题词
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeAHMMColor();"
                        title="【修改脑图主题颜色】&#10;系统预设了几十种主题颜色，可在&#10;此切换。注意：目前不支持对单个&#10;元素单独设置颜色。执行本操作后&#10;可恢复。">
                        更改脑图配色
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeColorOpacity();"
                        title="【设置脑图透明度】&#10;系统预设了若干种透明参数，可在&#10;此切换。注意：出于视觉效果等考&#10;虑，设定为透明后，主题词之间的&#10;连线将不再显示。执行本操作后可&#10;恢复。">
                        更改颜色透明
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeTextColor();"
                        title="【设置主题词/关联词颜色】&#10;系统预设了几十种文字颜色，可在&#10;此切换。注意：此处只可修改吸引&#10;子、主题词和关联词的颜色，其他&#10;文字颜色可使用相关 HTML标签设&#10;定，请参考各要素编辑窗口中的说&#10;明。执行本操作后可恢复。">
                        更改文字颜色
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeBorderColor();"
                        title="【设置主题词/关联词边框颜色】&#10;系统预设了几十种边框颜色，可在&#10;此切换，不支持对单个要素个别设&#10;定。注意：关联词之间的连线颜色&#10;也将自动改变。执行本操作后可恢&#10;复。">
                        更改边线颜色
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeBorderLine();"
                        title="【设置主题词/关联词边框宽度】&#10;系统预设了若干种边框宽度，可在&#10;此切换。注意：此操作不改变主题&#10;词之间连线的宽度。执行本操作后&#10;可恢复。">
                        更改边线宽度
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="changeBackgroundColor();"
                        title="【设置脑图背景颜色】&#10;系统预设了几十种背景颜色，可在&#10;此切换。执行本操作后可恢复。">
                        更改背景颜色
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="showHideBubbles();"
                        title="【设置主题词是否显示】&#10;根据需要将某些主题词隐藏起来，&#10;或显示出来。注意：目前不支持隐&#10;藏吸引子和关联词。执行本操作后&#10;可恢复。">
                        显示/隐藏主题词
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="showAHMMGene();"
                        title="【查看本脑图唯一ID】&#10;每一个阿色全息脑图 AHMM 都带&#10;有一个唯一的身份ID，并保存着遗&#10;传信息。这是全息有机系统的重要&#10;特性。">
                        显示脑图基因
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="introAHMM();"
                        title="【显示全息脑图示例】&#10;示例将在浏览器新窗口或标签页中&#10;打开，原脑图将继续存在于原窗口&#10;或标签页。">
                        全息脑图示例
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="newAHMMForUpdate();"
                        title="【读取旧版脑图并保存为新版】&#10;将在浏览器新窗口或标签页中进行&#10;操作，原脑图将继续存在于原窗口&#10;或标签页。注意：升级到新版后，&#10;需要使用<Ctrl+S>键保存。">
                        升级旧版脑图
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="showManual();"
                        title="【显示帮助和版本信息】&#10;说明系统特点、运行方式与环境、&#10;使用方法、联系方式等，并检查最&#10;新版本情况。">
                        显示使用说明
                    </button><br />
                    <button type="button" class="unselectable button_size_2" onclick="quitAHMMWithConfirm();"
                        title="【关闭窗口，退出脑图】&#10;关闭退出本脑图之前，确认已使用&#10; <Ctrl+S> 键保存数据，以防止数&#10;据丢失。">
                        退出当前脑图
                    </button><br />
                    <button type="button" class="unselectable" style="width:150px; height:30px; font-size:18px; border: 0px; background-color:#666666; color:#FFFFFF" onclick="closeMenuBox();"
                        title="【收起功能菜单】">
                        ▲
                    </button>
                </form>
            </div>
            <!-- 功能菜单条左侧的箭头 -->
            <div id="FUNCTION_MENU_BOX_ARROW" style="position:absolute; display:none; left: 1606px; top: 82px; font-size:10px; color:#666666;">◀</div>
                <!--  -->
                <!--  -->
                <!--====================================== 下面是显示功能菜单确认的窗口 ====================================-->
                <div id="FUNCTION_CONFIRM_BOX" class="unselectable show_box_0" style="left: 1490px; top: 170px;  width: 150px;">
                    <h3><span id="MENU_TITLE"></span></h3>
                    <h4><span id="MENU_TEXT"></span></h4>
                    <form name="show_select">
                        <button id="show_select1_1" type="button" class="button_size_1" style="width:75px;" onclick="changeSelectUp();">
                            ▲
                        </button><button id="show_select1_2" type="button" class="button_size_1" style="width:75px;" onclick="changeSelectDown();">
                            ▼
                        </button><br />
                        <button id="show_select2" type="button" class="button_size_3" onclick="confirmSelect();">
                            确定
                        </button><br />
                        <button id="show_select3" type="button" class="button_size_3" onclick="restorePrev();">
                            返回/取消
                        </button><br />
                    </form>
                </div>
                <!--  -->
                <!--  -->
                <!--================================+=== 下面是显示清空脑图内容确认的窗口 ==================================-->
                <div id="SHOW_CLEAN_BOX" class="unselectable show_box_0" style="left: 1490px; top: 170px; width: 150px;">
                    <h3><span id="MENU_TITLE2">清空脑图内容</span></h3>
                    <h4><span id="MENU_TEXT2">确定清空？</span></h4>
                    <form name="show_select">
                        <button id="show_select2_1" type="button" class="button_size_3" onclick="confirmClean();">
                            确定
                        </button><br />
                        <button id="show_select3_1" type="button" class="button_size_3" onclick="closeClean();">
                            取消
                        </button><br />
                    </form>
                </div>
                <!--  -->
                <!--  -->
                <!--====================================== 下面是显示恢复编辑历史确认的窗口 ====================================-->
                <div id="SHOW_RESTORE_BOX" class="unselectable show_box_0" style="left: 1490px; top: 170px;  width: 150px;">
                    <h3>恢复编辑历史</h3>
                    <h4><span id="MENU_TEXT3"></span></h4>
                    <form name="show_restore">
                        <button type="button" style="width: 35px; height: 22px;" onclick="restoreHistory2Start();">
                            |<
                        </button><button type="button" style="width: 40px; height: 22px;" onclick="restoreHistory2PrevFast();">
                            <<
                        </button><button type="button" style="width: 40px; height: 22px;" onclick="restoreHistory2NextFast();">
                            >>
                        </button><button type="button" style="width: 35px; height: 22px;" onclick="restoreHistory2End();">
                            >|
                        </button><br />
                        <button type="button" class="button_size_1" style="width:75px;" onclick="restoreHistory2Prev();">
                            ◀
                        </button><button type="button" class="button_size_1" style="width: 75px;" onclick="restoreHistory2Next();">
                            ▶
                        </button>
                        <br />
                        <button type="button" class="button_size_3" onclick="confirmRestoreHistory();">
                            确定
                        </button><br />
                        <button type="button" class="button_size_3" onclick="closeRestoreHistory();">
                            返回/取消
                        </button><br />
                    </form>
                </div>
                <!--  -->
                <!--  -->
                <!--==================================== 下面是显示保存脑图时的说明窗口 ====================================-->
                <div id="SHOW_SAVE_BOX" class="unselectable show_box_20" style="left: 1400px; top: 170px;  width: 450px;">
                    <h3>保存全息脑图</h3>
                    <h4>
                        <span id="SAVE_INFO_FOR_PC">
                            <h3><span style="color:#FF0000;">请使用 &lt;Ctrl+S&gt; 键保存</span></h3>
                            电脑端请使用浏览器自带的【保存网页】功能（&lt;Ctrl+S&gt;）<br />保存本页HTML文件。<br />保存后，该HTML文件还可以像普通文档一样再次打开继续编辑。<br />如存在链接页、封面图片等多个文件，应放在与本文件相同的文件夹，以便打包压缩。<br />浏览器可能还提供保存为【PDF】或【图片】的功能。<br />打印脑图请使用浏览器的【打印】功能。
                        </span>
                        <span id="SAVE_INFO_FOR_MOBILEDEVICE" style="display:none;">
                            移动设备请使用【保存/下载】键保存（即下载）全息脑图HTML文件。<br />保存后，该HTML文件一般存放在【下载内容】中。<br />可以像普通文档一样再次打开继续编辑。<br />浏览器可能还提供保存为【PDF】或【图片】的功能。<br />打印脑图请使用浏览器的【打印】功能。
                        </span>
                    </h4>
                    <h3><span style="color:#FF0000;">* 所有编辑只有【保存网页】后才真正保存到文件中</span></h3>
                    <form name="show_save">
                        <button id="save_ahmm_html" type="button" class="button_size_3" style="display:none;" onclick="saveAHMMHtml();closeSave();">保存/下载</button>
                        <button id="show_select1" type="button" class="button_size_3" style="display: inline;" onclick="closeSave();">关闭</button>
                    </form>
                </div>
                <!--  -->
                <!--  -->
                <!--================================== 下面是显示内部序参量是否隐藏的窗口 ==================================-->
                <div id="SHOW_HIDE_BOX" class="unselectable show_box_20" style="left: 1130px; top: 470px;  width: 450px;">
                    <h3>显示或隐藏主题词</h3>
                    <h4>选择希望显示的主题词</h4>
                    <form name="show_hide">
                        <button id="show_hide_select_all" type="button" style="width:80px; height:25px; font-size:14px;" onclick="selectHideAllNone(1)">全选</button>
                        <button id="show_hide_select_none" type="button" style="width:80px; height:25px; font-size:14px;" onclick="selectHideAllNone(0)">全不选</button>
                        <table border="0">
                            <tr>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_1" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[1]</span><span id="SHOW_HIDE_TEXT_1" style="font-size:14px;">主题词1</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_2" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[2]</span><span id="SHOW_HIDE_TEXT_2" style="font-size:14px;">主题词2</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_3" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[3]</span><span id="SHOW_HIDE_TEXT_3" style="font-size:14px;">主题词3</span></td>
                            </tr>
                            <tr>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_4" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[4]</span><span id="SHOW_HIDE_TEXT_4" style="font-size:14px;">主题词4</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_5" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[5]</span><span id="SHOW_HIDE_TEXT_5" style="font-size:14px;">主题词5</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_6" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[6]</span><span id="SHOW_HIDE_TEXT_6" style="font-size:14px;">主题词6</span></td>
                            </tr>
                            <tr>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_7" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[7]</span><span id="SHOW_HIDE_TEXT_7" style="font-size:14px;">主题词7</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_8" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[8]</span><span id="SHOW_HIDE_TEXT_8" style="font-size:14px;">主题词8</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_9" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[9]</span><span id="SHOW_HIDE_TEXT_9" style="font-size:14px;">主题词9</span></td>
                            </tr>
                            <tr>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_10" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[10]</span><span id="SHOW_HIDE_TEXT_10" style="font-size:14px;">主题词10</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;"><input type="checkbox" id="show_hide_11" checked style="height:12px;" /></td>
                                <td style="width: 120px; height: 12px; text-align: left;"><span style="font-size:14px;">[11]</span><span id="SHOW_HIDE_TEXT_11" style="font-size:14px;">主题词11</span></td>
                                <td style="width: 50px; height: 12px; text-align: right;">   </td>
                                <td style="width: 120px; height: 12px; text-align: left;">      </td>
                            </tr>
                        </table>
                        <br />
                        <button id="show_hide_confirm" type="button" class="button_size_3" onclick="saveHide();closeHide();">确认修改</button>
                        <button id="show_hide_cancel" type="button" class="button_size_3" onclick="closeHide();">返回</button>
                    </form>
                </div>
                <!--  -->
                <!--  -->
                <!--================================== 下面是显示全息脑图继承基因等信息的窗口 ==================================-->
                <div id="SHOW_GENE_BOX" class="show_box_20" style="left: 1130px; top: 420px; width: 450px;">
                    <h3>本脑图全息基因</h3>
                    <div style=" font-size: 14px; text-align: left; padding-left: 20px; padding-right: 20px;">
                        <span style="font-weight: bold;">本脑图名称：</span><span id="SELF_AHMM_TITLE"></span><br />
                        <span style="font-weight: bold;">本脑图ID：</span><span id="SELF_AHMM_ID"></span><br />
                        <span style="font-weight: bold;">本脑图所处遗传代次：</span><span id="SELF_AHMM_GENE_NUM"></span><br />
                        <span style="font-weight: bold;">本脑图创建时间：</span><span id="SELF_AHMM_CREATION_TIME"></span><br />
                        <span style="font-weight: bold;">本脑图最后更新时间：</span><span id="SELF_AHMM_LAST_TIME"></span><br />
                        <span style="font-weight: bold;">本脑图创建时所用AHMM的版本：</span><span id="SELF_AHMM_CREATION_VERSION"></span><br /><br />
                        <span style="font-weight: bold;">父脑图名称：</span><span id="FATHER_AHMM_TITLE"></span><br />
                        <span style="font-weight: bold;">父脑图ID：</span><span id="FATHER_AHMM_ID"></span><br />
                        <span style="font-weight: bold;">父脑图相关信息：</span><span id="FATHER_AHMM_INFO"></span><br /><br />
                        <span style="font-weight: bold; display: flex;">关于隐私信息和版权：</span>
                        ①上列信息仅供用户自行掌握，本软件不收集个人信息。②父脑图信息仅用于用户掌握本脑图的遗传路径和全息基因。③本脑图版权不受父脑图限制。阿色全息脑图AHMM及其衍生后代程序是开源的，自由使用，自由复制，自由分享，自由修改。<br /><br />
                    </div>
                    <button id="show_hide_cancel" type="button" class="button_size_3" onclick="closeGene();">关闭</button>
                </div>
                <!--  -->
                <!--  -->
                <!--=================================== 下面是显示使用说明（帮助）的窗口 ===================================-->
                <div id="SHOW_MANUAL_BOX" class="show_box_0" style="left: 460px; top: 100px; width: 1000px; height:900px; font-size: 10px; background-color: #FFFFFF; border: 0px solid #666666; z-index:2020;">

                    <div style="padding-left: 20px; padding-right: 20px; position: absolute; left: 900px; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;" onclick="closeManual();" onmouseover="this.style.backgroundColor='#AA0000';" onmouseout="this.style.backgroundColor='#666666';">✕</div>

                    <div id="DIV_LOGO_SMALL2" style="position: absolute; left: 435px; top: 60px; width: 130px; color:#FF0000; background-color:none; border: 0px solid #FF0000; text-align:center; font-size:10px; line-height:9px; ">
                        <table style="font-size:10px; line-height:9px; ">
                            <tr>
                                <td align="center">
                                    <span style="cursor:pointer;" title="AHMM：阿色版权所有 您可自由使用">
                                        ╔══╦╗╔╦═╦═╦═╦═╗<br />
                                        ║╔╗║╚╝║║║║║║║║║<br />
                                        ║╠╣║╔╗║║║║║║║║║<br />
                                        ╚╝╚╩╝╚╩╩═╩╩╩═╩╝<br />
                                    </span>
                                </td>
                            </tr>
                            <tr>
                                <td align="center">
                                    <span id="AHMM_VERSION2">Version D20120919.x</span>
                                </td>
                            </tr>
                        </table>
                    </div>

                    <div style="font-size:30px; line-height:35px; ">
                        <br /><br /><br /><br />
                        <b><span style="text-shadow:2px 2px #BBBBBB">阿色全息脑图 AHMM<br />使用说明</span></b>
                    </div>

                    <div align="justify" style="font-size:18px; line-height:22px;  padding-left: 50px; padding-right: 50px;">
                        <br />
                        <b>【系统功能】</b><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;用于制作新型思维导图——全息脑图（AHMM）。支持电脑、平板、手机，以及各种移动设备的键盘、鼠标、触屏、翻页笔等操作。比较适合主题演讲、讲座课件、总结报告，以及书籍概括、系统思考等。<br />
                        <b>【运行环境】</b><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;AHMM使用HTML和原生JavaScript编制，各主流浏览器均可使用，建议使用谷歌Chrome、微软Edge等最新版本浏览器，勿用360浏览器。本软件既可部署在服务器上运行，也可将本软件文件（ahmm.html）放在普通电脑本地独立运行。本地运行无需联网。最佳屏幕分辨率：1920x1080。建议使用浏览器自带全屏显示。<br />
                        <b>【软件特点】</b><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;①独特的数据存储技术：本软件使用“指令+数据一体化”的特殊技术，使得HTML文件既能执行JavaScript代码，又能为自身保存数据，这样用户就不必额外连接数据库或数据文件。用户可以像使用Word、Excel、PowerPoint等普通文档一样，将自己制作的全息脑图以HTML格式保存在本地，并可重复打开已保存的文件继续编辑、复制传播，甚至衍生执行！这种神奇的特性本身就是“全息有机系统”的特点。②在线或离线均可运行：由于采用HTML和JavaScript原生代码编写，不调用任何成品代码库或框架，因此可以完全脱网运行。<br />
                        <b>【使用方法】</b><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;①启动系统：本地运行时，双击ahmm.html（或由它生成的任何全息脑图文件）即可；联网运行时，用浏览器打开ahmm.html的链接即可。②制作全息脑图：软件具有新建、保存、编辑、调整、衍生执行等各项功能。开始界面即是模板，点击相应【...】即可修改。点击右上角的功能菜单图标【≚】，可对布局、颜色、线型等进行调整。可将多个全息脑图链接成一个多页播放的演示稿，各链接文件应置于同一个文件夹，可打包成zip/rar发布。③全屏播放：点击图标【▸】或按【F10】键进入；播放时支持键盘快捷键、翻页笔，以及手机等移动设备的触屏操作（边缘和四角）。④利用浏览器自带功能：浏览器的保存网页、图片、PDF，以及打印等功能均应优先使用。⑤本系统的全息性：用本软件生成的HTML文件，不仅可以作为全息脑图展示，同时也具有与原ahmm.html一样的运行能力，也可以继续创建新的脑图文件，可以无限延续下去。这是全息有机系统最独特的性质。<br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;进一步了解“全息脑图”和本系统使用方法，可按【示例】键参考具体“全息脑图”示例。<br /><br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;联系方式：【<b>微信公众号：大系统观开放论坛</b>】&nbsp;&nbsp;&nbsp;&nbsp;网站：【<a href="http://www.holomind.com.cn" target="_blank"><b>www.holomind.com.cn</b></a>】<br />
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;最新版本：【<b><span id="LAST_VERSION">D2023.6.9.19</span></b>】&nbsp;&nbsp;&nbsp;&nbsp;&nbsp<span id="LAST_VERSION_TEXT">您使用的不是最新版本，请到网站下载最新版本</span><br /><br />
                    </div>

                    <div align="center" style="font-size:20px; line-height:25px;  padding-left: 50px; padding-right: 50px;">
                        <form name="show_manual">
                            <button id="show_manual1" type="button" class="button_size_3" onclick="closeManual();">关闭</button>&nbsp;
                            <button id="show_manual2" type="button" class="button_size_3" onclick="introAHMM();">示例</button>
                        </form>
                    </div>

                </div>
                <!--  -->
                <!--  -->
                <!--=========================================== 下面是封底的窗口 ===========================================-->
                <div id="BACK_COVER" onclick="if (!g_inFullScreen || !g_inMobileMode) { nextItem();}" style="display: none;position: absolute; left: 0px; top: 0px;  width: 1920px; height:1080px; overflow:hidden; background-color: #FFFFFF; border: 0px solid #666666; opacity:1; z-index:8000; ">

                    <!--========封底图片 下面的img 先不指定src, 在js代码中指定，为了Ctrl+S保存时不生成 files文件夹。如果指定，则浏览器会为了这个图而单独使用一个关联的文件夹  ======-->
                    <!-- 下面的 height width 不修改 -->
                    <img id="BACK_COVER_IMG" src="" style="height: 100%; width: 100%;" alt=" 【封底图片】：打开失败。 封底图片需要与本脑图文件(html)存储于同一文件夹。建议：① 建立一个文件夹；② 将本脑图文件，以及所有与本脑图相关的文件、链接的各个文件、图片等保存在该文件夹；③ 进入该文件夹，重新打开已保存的本脑图文件进行编辑；④ 发布时将该文件夹整体打包为zip或rar。" border="0">
                </div>
                <!--  -->
                <!--  -->
                <!--=========================================== 下面是封面的窗口 ===========================================-->
                <div id="FACE_COVER" onclick="if (!g_inFullScreen || !g_inMobileMode) { nextItem();}" style="display: none;position: absolute; left: 0px; top: 0px;  width: 1920px; height:1080px; overflow:hidden; background-color: #FFFFFF; border: 0px solid #666666; opacity:1; z-index:8001; ">

                    <!--========封面图片 下面的img 先不指定src, 在js代码中指定，为了Ctrl+S保存时不生成 files文件夹。如果指定，则浏览器会为了这个图而单独使用一个关联的文件夹  ======-->
                    <!-- 下面的 height width 不修改 -->
                    <img id="FACE_COVER_IMG" src="" style="height: 100%; width: 100%;" alt="【封面图片】：打开失败。 封面图片需要与本脑图文件(html)存储于同一文件夹。建议：① 建立一个文件夹；② 将本脑图文件，以及所有与本脑图相关的文件、链接的各个文件、图片等保存在该文件夹；③ 进入该文件夹，重新打开已保存的本脑图文件进行编辑；④ 发布时将该文件夹整体打包为zip或rar。" border="0">

                    <div id="DIV_LOGO_SMALL3" style="position: absolute; top: 0px; width: 136px; color:#FF0000; background-color:transparent; border: 0px dashed #FF0000; float:left; text-align:left; ">
                        <!-- 左上角LOGO的DIV -->
                        <a href="http://www.holomind.com.cn" target="_blank">
                            <div id="DIV_LOGO_SMALL_PIC3" style="position: absolute; left: 95px; top: 20px; width: 136px; color: #FF0000; background-color:transparent; border: 0px dashed #FF5500; float: left; text-align: center; font-size: 10px; line-height: 9px; ">
                                <table id="AHMM_LOGO_TEXT3" style="display: none; font-size: 10px; line-height: 9px; ">
                                    <tr>
                                        <td align="center">
                                            <br />
                                            <span style="cursor:pointer; color:#FF0000;" title="AHMM：阿色版权所有 您可自由使用 点击获取最新版本">
                                                ╔══╦╗╔╦═╦═╦═╦═╗<br />
                                                ║╔╗║╚╝║║║║║║║║║<br />
                                                ║╠╣║╔╗║║║║║║║║║<br />
                                                ╚╝╚╩╝╚╩╩═╩╩╩═╩╝<br />
                                            </span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <span id="AHMM_VERSION4" style="cursor:pointer; color:#FF0000;">Version D20120919.x</span><br /><br />
                                        </td>
                                    </tr>
                                </table>
                                <img id="LOGO_PIC_IMG3" src="" border="0" style="width:100px; display:block;" alt="Logo图片打开失败：Logo图片需要与本脑图文件(html)存储于同一文件夹。">
                            </div>
                        </a>
                    </div>

                </div>
                <!--  -->
                <!--  -->
                <!--======================= 下面是屏幕左右两侧透明DIV，鼠标单击进入前后项。 ===========================-->
                <div id="CLICK_LEFT" class="unselectable" style="position: absolute; left: 0px; top: 0px; width: 90px; height: 1080px; overflow: hidden; font-size: 60px; display: flex; justify-content: center; align-items: center; color: #AAAAAA; background-color: #FFFFFF; opacity: 0; cursor: pointer; z-index: 50002; "
                     onclick="prevItem(); this.classList.add('flash'); setTimeout(() => this.classList.remove('flash'), 200);"
                     onmouseover="this.style.opacity = '0.5';"
                     onmouseout="this.style.opacity = '0';">⇦</div>
                <div id="CLICK_RIGHT" class="unselectable" style="position: absolute; left: 1820px; top: 0px; width: 100px; height: 1080px; overflow: hidden; font-size: 60px; display: flex; justify-content: center; align-items: center; color: #AAAAAA; background-color: #FFFFFF; opacity: 0; cursor: pointer; z-index: 50002; "
                     onclick="nextItem(); this.classList.add('flash'); setTimeout(() => this.classList.remove('flash'), 200);"
                     onmouseover="this.style.opacity = '0.5';"
                     onmouseout="this.style.opacity = '0';">⇨</div>
                <!--  -->
                <!--  -->
                <!--====================================== 下面是显示欢迎页面的窗口 ========================================-->
                <div id="SHOW_WELCOME_BOX" class="show_box_0" style="padding-top: 100px; left: 460px; top: 230px;  width: 1000px; height:570px; font-size: 30px; line-height:31px; color:#000000; background-color: #FFFFFF; border: 0px solid #666666; opacity:1;  z-index:9001;">
                    <span style="cursor:pointer; color:#FF0000; "
                          onmouseover="$('SHOW_USE_TIMES').style.display='block'; $('USE_TIMES').src = 'https://s11.flagcounter.com/mini/jzwg/bg_FFFFFF/txt_000000/border_CCCCCC/flags_0/'; "
                          onmouseout="$('SHOW_USE_TIMES').style.display='none'; $('USE_TIMES').src=''; ">
                        <!--==================上面显示服务次数。$("USE_TIMES").src = "" 避免浏览器保存时生成files文件夹，图像或js代码会被存入该文件夹 ===================-->
                        ╔══╦╗╔╦═╦═╦═╦═╗<br />
                        ║╔╗║╚╝║║║║║║║║║<br />
                        ║╠╣║╔╗║║║║║║║║║<br />
                        ╚╝╚╩╝╚╩╩═╩╩╩═╩╝<br />
                    </span>

                    <div id="SHOW_USE_TIMES" align="center" style="display: none; padding-left: 10px; padding-right: 10px; padding-top: 10px; padding-bottom: 10px; position: absolute; left: 660px; top: 200px;  width: 200px; height:50px; text-align:center; font-size: 12px; line-height:16px; color:#000000; background-color: #FFFFFF; border: 1px solid #666666; opacity:1;  z-index:2012;">
                        阿色全息脑图AHMM<br>服务总次数<br>

                        <!--======== 下面的img 先不指定src, 在js代码中指定，为了Ctrl+S保存时不生成 files文件夹。如果指定，则浏览器会为了这个图而单独使用一个关联的文件夹  ======-->
                        <img id="USE_TIMES" src="" alt="120,919 pageviews" border="0">

                    </div>

                    <span id="AHMM_VERSION3" style="cursor:pointer; color:#FF0000; " title="AHMM：阿色版权所有 您可自由使用">Version D2012.9.19.x</span>

                    <div style="font-size:50px; line-height:60px;  z-index:2012;">
                        <br />
                        <b><span style="text-shadow:2px 2px #BBBBBB">阿色全息脑图 AHMM</span></b>
                    </div>

                    <div style="font-size:35px; line-height:36px;  z-index:2013; ">
                        <b><span style="text-shadow:2px 2px #BBBBBB">Arthur's Holographic Mind Map</span></b>
                    </div>

                    <div id="FULL_SCREEN_HINT" style="font-size:16px; line-height:30px; z-index:2014; ">
                        <br /><br />
                        <span id="SUGGEST_INFO">文字由后面程序设定</span>
                        <form name="show_welcome">
<!--====================================== 下面 title 的文字可以换行正常显示，不要格式化，不要修改格式 ===================================-->
                            <button id="BUTTON_PLAY_WELCOME" type="button" class="button_size_1" style="width: 160px; cursor:pointer;" onclick="goIntoFullScreenAndPlay();" title="
.
【播放向导】
    1 键盘操作
        ①播放：【F11】+【F10】
        ②退出播放：【F11】+【Esc】
        ③前/后项切换(脑图内)：【←】/【→】 
        ④上/下页切换(脑图间)：【↑】/【↓】
        ⑤起始页：【Home】 
        ⑥当前目录：【End】
        ⑦打开链接：当前项高亮时，【回车】或连击2次【→】  
        ⑧从内嵌链接返回：连击2次【→】
    2 鼠标操作
        ①播放：【浏览器全屏】+【▶】
        ②退出播放：【浏览器退出全屏】+【...】
        ③前/后项切换：右上角或屏幕左右边【⇦】/【⇨】
        ④上/下页切换：【⇧】/【⇩】
        ⑤起始页：【☉】
        ⑥当前目录：【 . 】
        ⑦打开链接：单击带有链接的项
        ⑧从内嵌链接返回：【↵】
    3 激光翻页笔
        翻页笔【↑】= 键盘【←】
        翻页笔【↓】= 键盘【→】
        其他操作需要使用键盘或鼠标
.     
        "
    > ▶ 播放【F10】</button>
                            <button id="BUTTON_EDIT_WELCOME" type="button" class="button_size_1" style="width:120px; cursor:pointer;" onclick="startEdit();"  title="
.
【编辑向导】
    ①编辑脑图内容：点击各个【...】打开编辑框。
    ②修饰脑图：点击菜单【≚】修改颜色等，或其他操作。
    ③保存脑图：按<Ctrl+S>键（苹果电脑为Command+S）  
       或浏览器【保存网页】，保存脑图文件。
    ④再次编辑：文件夹中打开已保存的文件继续编辑。
    ★链接的文件应置于同一文件夹，可打包成zip/rar发布。
.                        
        "

    >新建/编辑 ...</button>
<!--====================================== 上面 title 的文字可以换行正常显示，不要格式化，把要修改格式 ===================================-->
                            <button id="BUTTON_QUIT_WELCOME" type="button" class="button_size_1" style="width:60px;" onclick="quitAHMM();">退出</button>
                            <button id="BUTTON_INTRO_WELCOME" type="button" class="button_size_1" style="width:60px;" onclick="introAHMM();">示例</button>
                            <button id="BUTTON_MOBILE_MODE_WELCOME" type="button" class="button_size_1" style="width:170px;" onclick="forceIntoMobileMode();">进入移动模式</button>
                            <button id="BUTTON_PC_MODE_WELCOME" type="button" class="button_size_1" style="display:none; width:170px;" onclick="forceIntoPCMode();">进入电脑模式</button>
                            <button id="BUTTON_MANUAL_WELCOME" type="button" class="button_size_1" style="width:170px;" onclick="showManual();">帮助 / 检查更新<span id="UPDATE_MARK" style="color:red; display:none;">*</span></button>
                        </form>
                        <h4>自由使用 自由复制 自由分享&nbsp;&nbsp;&nbsp;&nbsp;版权所有: 阿色 Copyright ©2022-<span id="CURRENT_YEAR"></span></h4>
                    </div>

                    <!--=== 将移动设备播放键放大，直接进入全屏播放状态 ==-->
                    <div id="FULL_SCREEN_FOR_MOBILEDEVICE" style="display:none;">
                        <div style="font-size: 120px; line-height: 45px; text-align:center; z-index: 2015; background-color: #FF6666; position: absolute; left: 1010px; top: 0px; width: 360px; height: 318px; border: 1px solid white; padding-top: 20px;" onclick="startEdit(); goIntoFullScreenAndPlay();">
                            <br /><br />
                            <span style="font-size:120px;"> ▶ </span>
                            <span style="font-size: 70px; line-height: 90px;"><br />全屏播放</span>
                        </div>
                        <div style="position: absolute; left: 1010px; top: 350px; width: 360px; height: 318px; border: 1px solid white; font-size: 36px; line-height: 36px; text-align: center; color: white; ">
                            <br />
                            <span style="font-size: 45px; line-height: 55px;">触屏控制</span><br />
                            【左上角】：重载<br />
                            【右上角】：退出<br />
                            【左下角】：编辑<br />
                            【右下角】：播放<br />
                            【屏四周】：切换<br /><br />
                        </div>
                    </div>

                </div>
                <!--  -->
                <!--  -->
                <!--=================================== 下面是升级旧版本AHMM文件的窗口 =====================================-->
                <div id="UPDATE_AHMM_FILE" class="show_box_50" style="z-index: 20010; display: block; left: 550px; top: 300px; width: 700px;">
                    <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                         onclick="hideUpdate();quitAHMM();"
                         onmouseover="this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.backgroundColor='#666666';">✕</div>
                    <br />
                    <h2>升级旧版AHMM文件</h2>
                    <h3><span style="color:#FF0000;">【重要提示】请做好备份！！！</span><br /></h3>
                    <div align="center">
                        <form name="update_file" onkeydown="if(event.keyCode==13){confirmUpdate();}">
                            <!-- 不修改 -->
                            旧版文件&nbsp;&nbsp;&nbsp;<input type="text" id="old_file" class="input_text" size=40 value="点击右侧【选择文件】" disabled />
                            <input type="file" id="old_file_t" accept="text/html,.html" onchange="ofs(event);" style="opacity: 1; width: 72px;"><br />
                            <script>
                                // 获取被升级文件html的文本
                                let ofs = (e) => {
                                    let reader = new FileReader();
                                    reader.readAsText(e.target.files[0]);
                                    reader.onload = (event) => {
                                        g_htmlText = event.target.result;
                                    }
                                    var doc = $('old_file');
                                    var upload = $('old_file_t');
                                    var fileName = upload.files[0].name;
                                    var filePath = upload.value;
                                    doc.value = fileName;
                                }
                            </script>
                            <h3>还可采用<span style="color:#FF0000;">【AHMM批量升级工具.EXE】</span>自动将一个文件夹中的脑图一键升级<br />请到大系统观官网（<a href="http://www.holomind.com.cn" target="_blank" style="text-decoration:none" title="打开【大系统观官网】">www.holomind.com.cn</a>）下载<br /></h3>
                            <button id="confirm_update" type="button" class="button_size_1" onclick="confirmUpdate();">确认升级</button>
                            <button id="clear_update" type="button" class="button_size_1" onclick="clearUpdate();">清除信息</button>
                            <button id="update_cancel" type="button" class="button_size_1" onclick="hideUpdate();quitAHMM();">取消/返回</button>

                            <br /><br />
                            <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                            <input type="text" style="display:none" />
                        </form>
                    </div>
                </div>
                <!--  -->
                <!--  -->
                <!--============================== 下面是升级旧版本AHMM文件完成后提醒的窗口 ================================-->
                <div id="UPDATE_AHMM_FILE_FINISH" class="show_box_50" style="z-index: 20010; left: 550px; top: 300px; width: 700px;">
                    <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                         onclick="hideUpdateAhmmFileFinish();"
                         onmouseover="this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.backgroundColor='#666666';">✕</div>
                    <br />
                    <h2>升级旧版AHMM文件</h2>
                    <h3><span style="color:#FF0000;">升级完毕。<br />请检查升级后的文件。您可继续编辑。</span><br /><br /></h3>
                    <h2>确认无误后请按 &lt;Ctrl+S&gt; 键保存。</h2>
                    <h3>保存时请确认是否覆盖原文件。<br /></h3>
                    <div align="center">
                        <form name="update_file_finish" onkeydown="if(event.keyCode==13){$('UPDATE_AHMM_FILE_FINISH').style.display = 'none';}">
                            <button id="confirm_update_finish" type="button" class="button_size_1" onclick="hideUpdateAhmmFileFinish();">OK</button>
                            <br /><br />
                            <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                            <input type="text" style="display:none" />
                        </form>
                    </div>
                </div>
                <!--  -->
                <!--  -->
                <!--============================== 下面是AI自动生成AHMM文件完成后提醒的窗口 ================================-->
                <div id="AI_AHMM_FILE_FINISH" class="show_box_50" style="z-index: 20010; left: 620px; top: 300px; width: 500px;">
                    <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                         onclick="hideAIAhmmFileFinish();"
                         onmouseover="this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.backgroundColor='#666666';">✕</div>
                    <br />
                    <h2>AI自动生成AHMM文件</h2>
                    <h3><span style="color:#FF0000;">生成完毕。<br />请检查生成的文件。您可继续编辑。</span><br /><br /></h3>
                    <h2>确认无误后请按<span style="color:#FF0000;"> &lt;Ctrl+S&gt;</span> 键保存。</h2>
                    <h3><span style="color:#FF0000;">请确认保存后再关闭，否则数据可能丢失。</span><br /></h3>
                    <div align="center">
                        <form name="ai_file_finish" onkeydown="if(event.keyCode==13){$('AI_AHMM_FILE_FINISH').style.display = 'none';}">
                            <button id="confirm_ai_finish" type="button" class="button_size_1" onclick="hideAIAhmmFileFinish();">OK</button>
                            <br /><br />
                            <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                            <input type="text" style="display:none" />
                        </form>
                    </div>
                </div>
                <!--  -->
                <!--  -->                
                <!--======================================== 下面是确认退出的窗口 ==========================================-->
                <div id="CONFIRM_QUIT" class="show_box_50" style="z-index: 20010; left: 650px; top: 300px; width: 500px;">
                    <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                         onclick="hideConfirmQuit();"
                         onmouseover="this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.backgroundColor='#666666';">✕</div>
                    <br />
                    <h2>退出当前全息脑图</h2>
                    <h3><span style="color:#FF0000;">更改尚未保存。<br />【重要提示】请确认已妥善保存当前脑图文件！！！</span><br /></h3>
                    <h3>保存当前全息脑图文件，请按 &lt;Ctrl+S&gt; 键。<br /></h3>
                    <h3>确认退出当前全息脑图吗？<br /></h3>
                    <div align="center">
                        <form name="confirm_quit_form" onkeydown="if(event.keyCode==13){quitAHMM();}">
                            <button id="confirm_quit" type="button" class="button_size_1" onclick="quitAHMM();">确认退出</button>
                            <button id="quit_cancel" type="button" class="button_size_1" onclick="hideConfirmQuit();">取消/返回</button>
                            <br /><br />
                            <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                            <input type="text" style="display:none" />
                        </form>
                    </div>
                </div>
                <!--  -->
                <!--  -->
                <!--============================== 下面是确认重新加载的窗口，仅移动设备上使用 ==================================-->
                <div id="CONFIRM_RELOAD" class="show_box_50" style="z-index: 20010; left: 650px; top: 300px; width: 500px;">
                    <div style="padding-left: 20px; padding-right: 20px; float:right; font-size: 22px; background-color: #666666; color:#FFFFFF;  cursor:pointer;"
                         onclick="hideConfirmReload();"
                         onmouseover="this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.backgroundColor='#666666';">✕</div>
                    <br />
                    <h2>重新加载打开当前全息脑图</h2>
                    <h3><span style="color:#FF0000;">【重要提示】如果重新加载打开，当前脑图将被关闭！！！</span><br /></h3>
                    <h3>未保存的修改将作废。<br /></h3>
                    <h3>确认重新打开当前全息脑图吗？<br /></h3>
                    <div align="center">
                        <form name="confirm_reload_form" onkeydown="if(event.keyCode==13){reloadAHMM();}">
                            <button id="confirm_reload" type="button" class="button_size_1" onclick="reloadAHMM();">确认重新打开</button>
                            <button id="reload_cancel" type="button" class="button_size_1" onclick="hideConfirmReload();">取消/返回</button>
                            <br /><br />
                            <!-- 【重要警告】下行不可删除，用于防止按回车自动提交form。如删除，html文件将会重载，所做编辑将丢失 -->
                            <input type="text" style="display:none" />
                        </form>
                    </div>
                </div>
                <!--  -->
                <!--  -->
                <!--================================== 下面是打开内嵌图片和iframe的窗口 ====================================-->
                <div id="OPERATE_INNER_FRAME" style="display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 135px; background-color: transparent; border: none; text-align: right; z-index: 50001; ">
                    <div style="position: absolute; left:0px; top: 0px; width: 1840px; height: 23px; background-color: #FFFFFF; "></div>
                    <div id="CLOSE_INNER_LINK" title="关闭浏览，返回【当前脑图】" class="unselectable" style="position: absolute; left:1785px; top: 0px; width: 30px; height: 22px; font-size: 20px; line-height: 20px; cursor: pointer; float: right; text-align: center; background-color: #888888;  color: #FFFFFF; "
                         onclick="closeInnerLink();"
                         onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='#888888'; this.style.color='#FFFFFF'; ">↵</div>
                    <div id="RELOAD_DIR" title="刷新/返回【当前脑图所在目录】" class="unselectable" style="position: absolute; left:1752px; top: 0px; width: 30px; height: 22px; font-size: 16px; line-height: 20px; cursor: pointer; float: right; text-align: center; background-color: #888888;  color: #FFFFFF; "
                         onclick="$('INNER_FRAME').src='.';"
                         onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                         onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='#888888'; this.style.color='#FFFFFF'; ">↻</div>
                    <div style="position: absolute; left:0px; top: 0px; width: 100px; height: 1080px; background-color: #FFFFFF; "></div>
                    <div style="position: absolute; left:1820px; top: 0px; width: 100px; height: 1080px; background-color: #FFFFFF; "></div>
                    <a href="http://www.holomind.com.cn" target="_blank">
                        <div style="position: absolute; left:90px; top: 23px; width: 140px; height: 100px;  cursor: pointer; background-color: transparent;  "></div>
                    </a>
                    <div style="position: absolute; left:250px; top: 23px; width: 1440px; height: 180px;  background-color:  #FFFFFF; text-align: center; font-size: 28px; ">
                        <br />
                        <b>
                            <font size=40><span id="INNER_TITLE" style="cursor:default; text-shadow:2px 2px #BBBBBB; color:#000000;"></span></font>
                        </b>
                        <span id="INNER_TITLE2" style="cursor:default; text-shadow:2px 2px #BBBBBB; color:#000000;"></span>
                    </div>

                </div>
                <!-- 下面DIV用于移动设备模式，将返回图标放大，便于触屏操作。PC与手机显示不一样，此处经手机测试过，勿以PC为准。  -->
                <div id="CLOSE_INNER_LINK2" title="关闭浏览，返回【当前脑图】" class="unselectable" style="display: none; position: absolute; left: 1675px; top: 30px; width: 150px; height: 88px; font-size: 120px; line-height: 20px;  cursor: pointer; float: right; text-align: center; background-color: #888888; color: #FFFFFF; z-index: 50003; "
                     onclick="closeInnerLink();"
                     onmouseover="this.style.color='#FFFFFF'; this.style.backgroundColor='#AA0000';"
                     onmouseout="this.style.color='#FFFFFF'; this.style.backgroundColor='#888888'; this.style.color='#FFFFFF'; ">↵</div>
                <!--  -->
                <!--  -->
                <!--================================== 下面是装载内嵌图片和iframe的窗口 ====================================-->
                <div id="DIV_INNER_FRAME" style="border: 5px outset #BBBBBB; width: 1720px; padding-left: 0px; margin-left: auto; margin-right: auto; text-align: center; display: none; background-color: #FFFFFF; position: absolute; z-index: 50002; ">
                    <!-- 此处DIV用于内嵌显示本地目录、图片或html等，必须动态生成，否则保存时会出现附件文件目录。装载图片用table，本地目录、html等用iframe -->
                </div>
                <!--  -->
                <!--  -->
                <!--================================ 下面是全屏播放时显示当前时间的窗口 ====================================-->
                <!-- 时间显示不使用纯黑色，避免与黑背景混 -->
                <div id="DIV_TIME_DISPLAY" style="display: flex; background-color: #DDDDDD; clear: both; font-size: 16px; position: absolute; left: 920px; top: 1048px; width: 80px; height: 22px; justify-content: center; align-items: center; z-index: 60000; "></div>
                <!--  -->
                <!--  -->
                <!--================================ 此DIV的<input>用于保持正文页的焦点  ===================================-->
                <div style="display: block; overflow:hidden; position: absolute; left: 0px; top: 0px; width: 0px; height: 0px; z-index: 1; ">
                    <!-- 当iframe打开外部html时，焦点会转移到新的html上，这样上下页、左右箭头等键盘操作就会不起作用。因此要在html完成load后用后面的js拿回焦点。 -->
                    <!-- type="checkbox"， 不能是"text"，否则获得焦点后手机会自动打开输入法。此DIV实际是看不见的。 -->
                    <input id="HOLD_FOCUS" type="checkbox" />
                </div>

            </div> <!-- <div id="DIV_ALL"> 结束 -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--========================================== 编辑互动窗口，及菜单等显示与互动的窗口结束 =================================================-->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--  -->
            <!--  -->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--===================================== html主体文本结束。它内部的一些数据由js修改形成最终html ==========================================-->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--  -->
            <!--  -->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--======================================== 下面是js操作代码，用于修改上面的参数形成最终的html ===========================================-->
            <!-- js操作代码必须放在html文件的最后，因为js要使用的数据、html框架都必须先于js加载，否则js无法运行。 ========================================-->
            <!--===================================================================================================================================-->
            <!--===================================================================================================================================-->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->
            <!--  -->

            <script>
                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************
                // ************************************************************ JavaScript操作代码开始 *********************************************************
                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************

                // *************************************************************** 定义与声明 **********************************************************
                // 常量、全局变量等不可在<head>中定义，因为<head>中JS代码只载入但不执行，因此应在<body>中

                // 定义常量。标准设置以全屏显示时所见为准。
                const AHMM_VERSION = "ai⁺2025.12.9.19";  // 当前版本号，每次更新版本时要修改
                const AHMM_LAST_TIME = "2025-07-01 00:00:00";   // 当前版本发布更新时间，应修改为与版本号相对应的时间

                const AHMM_CREATION_TIME = "2012-09-19 00:00:00";  // AHMM软件初创时间，不要修改
                const AHMM_CREATION_VERSION = "0.0.1 (自创生)";   // AHMM软件初创版本，不要修改

                const AHMM_TITLE = "+全息脑图标题";  // 程序名称，默认标题
                const AHMM_GENWORDS = "[+概述]<span style='color: #AA0000; font-family: 楷体; font-size: 40px; font-weight: bold;'>全息脑图</span>是按照大系统思维原理制作的新型思维导图。让您以系统的观点看世界，专注系统的结构信息——全息，抓住事物的本质，透过表象和数据发现规律。单击各个【...】编辑脑图，【≚】排版配色，&lt;<span style='color: #AA0000;'>Ctrl+S</span>&gt;键（苹果电脑为Command+S）或浏览器菜单【保存/下载】永久保存。";  // 默认概述
                const AHMM_AUTHOR = "© 版权所有&nbsp;&nbsp;&nbsp;&nbsp;作者：阿色 2012.9.19（参考）";  // 默认作者
                const SCREEN_WIDTH_STANDARD = 1920;   // 屏幕宽度基准，不用管移动设备端，移动设备会自适应。
                const SCREEN_HEIGHT_STANDARD = 1080;  // 屏幕高度基准，移动设备端会按照宽和高自动缩放，不要用移动设备特定的尺寸计算
                const X_MARGIN = 100;  // 整个全息脑图左右留的空白，标准为100。
                const Y_MARGIN = 20;  // 整个全息脑图纵向留的空白，仅影响底部，不影响顶部。标准为50。
                const Y_TOPIC_HEIGHT = 135;  // 全息脑图标题高度，标准为135。
                const Y_FOOTER_HEIGHT = 25;  // 底端横条高度，标准为10。
                const X_OFFSET = 50;  // 内部序参量显示区横向右移的量，标准为50。
                const Y_OFFSET = 320;  // 内部序参量显示区纵向下移的量，标准为320。此上面部分用于概述。
                const INNER_OFFSET = 12;  // 泡泡在自己的DIV中的整体内部偏移。
                const LEFT_AREA_RATE = 3 / 4;  // 左侧内参圆泡泡bubble图区域宽度占总宽度比例，标准为3/4。
                const CIRCLE_SHADOW_OFFSET = 5;  // 序参量圆泡泡)bubble阴影偏移距，标准为5。
                const TEXT_SHADOW_OFFSET = 2;   // 文字阴影偏移距,，标准为2。
                const GRIDS_NUBER = 100;    // 自动排版使用。圆泡泡bubble区定位网格数，横向。纵向自动计算。正方形。标准为20~200。小于100会有重叠。
                const ATTRACTOR_COLOR = "#FF0000";   // 吸引子符号@的颜色，标准为"#FF0000"。
                const R_SCALE_FOR_OPACITY = 1.4;   // 泡泡透明时，扩大半径的倍数
                const TRY_TIMES = 3000;  // 随机摆放圆泡泡bubble时，为了避免重叠，尝试摆放的最大次数。
                const SCALE_FOR_STORY_MODE = 0.7;  // 使用故事线模式时，所有泡泡均统一到相同的尺寸。

                // 声明全局变量/通用变量
                var g_totalWidth, g_leftWidth, g_rightWidth, g_mainHeight;   // 左面内部序参量圆泡泡bubble区、右面外部关联参量长方块block区的宽度和高度，由屏幕尺寸计算
                var g_scrnScl = 1;   // 在不同屏幕上整体缩放的比例
                var g_targetScrnWidth;  // 实际的目标屏幕宽度
                var g_targetScrnHeight;  // 实际的目标屏幕高度

                var g_fileModified = 0;     // 从上次保存后文件是否修改过，用于退出时判断是否确认
                var g_bubblesFixedOrRandom;  // 字符型，泡泡是否是固定的（即脑图已存在，不是新建的）。"1"固定的，"0"新建的脑图
                var g_mapTitle = g_prevPage = g_nextPage = g_homePage = g_faceCover = g_backCover = g_innerLink = g_logoPic = g_backPic = g_backMusic = g_sequentialPlay = g_showTimeWhenPlay = g_storyLine = "";   
                            // 脑图标题、上一页、下一页、起始页、封面、封底、内联链接、Logo、背景图片、渐进式播放、显示时间、故事线模式
                            // 故事线模式，默认为""，即星形模式，即以吸引子@为中心；故事线模式按时间顺序排列泡泡。非"" 表示采用故事线模式。
                var g_faceCoverCurrentNo = 0;    // 多个封面图片时，当前显示的图片顺序
                var g_backCoverCurrentNo = 0;    // 多个封底图片时，当前显示的图片顺序
                var g_innerLinkCurrentNo = 0;    // 多个内联链接时，当前显示的链接顺序
                var g_faceCoverTotalNum = 0;     // 封面图片总数
                var g_backCoverTotalNum = 0;     // 封底图片总数
                var g_innerLinkTotalNum = 0;     // 内联链接总数
                var g_saveFaceCoverOrNot = 0;  // 只有设置封面时才保存封面图片的src，为了避免在保存脑图时出现file文件夹
                var g_saveBackCoverOrNot = 0;  // 封底，同封面
                var g_saveLogoPicOrNot = 0;   // 只有设置Logo时才保存Logo图片的src，为了避免在保存脑图时出现file文件夹
                var g_saveBackPicOrNot = 0;   // 只有设置背景图片时才保存其图片的src，为了避免在保存脑图时出现file文件夹
                var g_saveBackMusicOrNot = 0;   // 只有设置背景音乐时才保存其音乐的src，为了避免在保存脑图时出现file文件夹
                var g_hideSupportInfo = 0;   // 底端制作支持信息，0和其他：不隐藏，1：隐藏

                var g_genWords, g_genWordsTitle, g_genWordsText;  // 概述全文、标题、文字
                var g_authorDate;  // 作者、日期
                var g_inMark;     // 左标签内部序参量
                var g_outMark;    // 右标签外部关联参量

                var g_currentHighLightNo = -1;    // 当前高亮的项：概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17。初始值=-1，为了不论上下都从概述开始
                var g_maxHighLightNo = -1;        // 高亮号曾经达到的最大值，用于渐进式播放时控制显示到哪个泡泡或块块
                var g_deCurrentHighLightNo = -1;  // 前一个高亮的项，与g_currentHighLightNo配合，用于键盘控制高亮
                var g_highLightShowing = false;  // 是否有高亮显示，用于回车调出超链接时，如果没有高亮显示，则回车不调超链接
                var g_keepHighLight = false;   // 保持高亮。在打开外联网页时，因鼠标移动，高亮会取消，需要做标记
                var g_maxPlayNo = 0;     // 播放的最大泡泡ID

                var g_zIndexBox = 10000;   // 用于编辑窗口点击时置顶
                var g_zIndexBubble = 1000;  // 用于内部序参量泡泡点击时置顶
                var g_zIndexAfterScale = 5000;  // 用于播放时鼠标悬停时将该DIV置顶
                var g_zIndexBeforeScale = 0;  // 用于播放时鼠标悬停时将该DIV置顶之前的位置记录

                var g_changeTypeOnFuncMenu;   // 切换类型：排版、颜色、线型
                var g_arrangeNo = 0;    // 重排脑图泡泡使用XY位置数组的编号
                var g_arrangeTotalNum = 0;  // 重排脑图泡泡使用XY位置数组的总数
                var g_colorSetNo = 0;   // 颜色系列编号，从1开始，即数组 :g_bubbleColor[]的1 ~ n
                var g_colorOpacityNo = 0;   // 颜色透明度
                var g_textColorNo = 0;   // 文本颜色编号，不包括概述，概述永远是黑色
                var g_borderColorNo = 0;  //  // 边框颜色编号
                var g_borderWidthNo = 0;   // 边框宽度编号
                var g_backgroundColorNo = 0;   // 背景颜色编号
                var g_menuBarShouldDisplay = false;    // 在全屏播放时，控制是否显示控制条菜单
                var g_menuBarWidth = 185;     // 控制菜单条宽度，需要根据显示图标个数调整
                var g_menuBarLeft = 1616;
                var g_menuCharLeft = 1583;    // 下拉菜单单独控制

                var g_inFullScreen = false;   // 判断是否在全屏播放模式，用于决定响应哪些键盘事件
                var g_faceCoverShowing = true;   // 封面是否在显示，用于全屏播放时的键盘和翻页笔控制
                var g_backCoverShowing = false;   // 封底，同封面
                var g_innerLinkShowing = false;  // 内部链接是否处于打开的状态。打开时脑图被遮盖，前后项、上下页等操作应停止响应。
                var g_timesHintShowed = 0; // 播放时显示提示的次数，仅在必要时提示
                var g_inDeHighLightAll = false;    // 标记是否正在执行 function deHighLightAll()？ 在 function deHighLightBubble()中，如果为 true，则不处理泡泡的 zIndex，保持遮挡关系不变。

                var g_inMobileMode = false;   // 是否以移动设备模式运行。当强制使用移动模式时，此值也为真
                var g_devMode = "";        // 强制使用的设备模式，电脑模式="c"、移动模式="m"、程序决定=""。有时程序无法识别设备，此时可强制进入相应模式
                var g_funcMode = "";       // 打开AHMM.html的模式，分为：直接打开，=默认=""、示例="1"、新建="2"、上下页切换="3"或"4"、升级旧文件="5"。

                var g_restoreColorSetNo = 1;  // 需要初始化
                var g_restoreColorOpacityNo = 0;   // 需要初始化
                var g_restoreTextColorNo = 0;   // 需要初始化
                var g_restoreBorderColorNo = 0;   // 需要初始化
                var g_restoreBorderWidthNo = 0;   // 需要初始化
                var g_restoreBackgroundColorNo = 0;   // 需要初始化

                var g_borderUsed = 1;  // 是否要画边
                var g_r_Scale = 1.0;    // 泡泡半径放大的倍数，用在透明风格时，让半径增大，产生颜色叠加效果，其他不变。
                var g_tmpID, g_tmpValue;   // 临时使用
                var g_inDrag = 0;  // 标记是否在拖动
                var g_tmpBubbleClicked = 0;   // 是否点击过泡泡？如果单击过，鼠标移走后，标记保留

                var g_tmpBlockClicked = 0;   // 是否点击过块块？如果单击过，鼠标移走后，标记保留

                var g_htmlText = "";        // 被升级的AHMM文件的全部文本

                // 内部序参量圆泡泡bubble部分全局变量
                var g_iLocX, g_iLocY, g_iLocR, g_iLocW, g_iLocH, g_iFontSize;    // 定位点坐标，像素
                var g_gridsArray = new Array();         // 用二维数组标记内参量圆泡泡bubble是否占用。0，表示位置未被占用。先声明，后面初始化。
                var g_currentBubbleID;     // 当前刚被点击的内部序参量圆泡泡bubble的序号。
                var g_currentDIV;   // 正在被移动的内部序参量泡泡的编号。
                var g_iParaID = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];   // 内部参量圆泡泡bubble的编号。0是系统吸引子编号。
                var g_bubbleScl = [1, 0.9, 0.85, 0.75, 0.70, 0.65, 0.60, 0.55, 0.50, 0.45, 0.35, 0.30];   // 圆泡泡bubble大小，已经归一化，最大为1
                var g_bubbleX = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
                var g_bubbleY = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
                var g_Title = " 阿色全息脑图（AHMM: Arthur's Holographic Mind Map）";
                var g_bubbleText0 = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleText1 = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleText2 = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleText3 = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleText4 = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleLink = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubblePic = ["", "", "", "", "", "", "", "", "", "", "", ""];
                var g_bubbleScale = ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1"];
                var g_bubbleColor = new Array();
                g_bubbleColor[0] = ["#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF"];
                g_bubbleColor[1] = ["#FFFFFF", "#FDFDFD", "#FCFCFC", "#FBFBFB", "#FAFAFA", "#F9F9F9", "#F8F8F8", "#F8F8F8", "#F7F7F7", "#F6F6F6", "#F5F5F5", "#F4F4F4"];
                g_bubbleColor[2] = ["#AAAAAA", "#B1B1B1", "#B8B8B8", "#C0C0C0", "#C7C7C7", "#CFCFCF", "#D2D2D2", "#D6D6D6", "#DDDDDD", "#E5E5E5", "#ECECEC", "#F4F4F4"];
                g_bubbleColor[3] = ["#000000", "#181818", "#303030", "#494949", "#616161", "#7A7A7A", "#868686", "#929292", "#AAAAAA", "#C3C3C3", "#DBDBDB", "#F4F4F4"];
                g_bubbleColor[4] = ["#0000FF", "#1818FD", "#3030FC", "#4949FB", "#6161FA", "#7A7AF9", "#8686F8", "#9292F8", "#AAAAF7", "#C3C3F6", "#DBDBF5", "#DBDBF5"];
                g_bubbleColor[5] = ["#00FF00", "#18FD18", "#30FC30", "#49FB49", "#61FA61", "#7AF97A", "#86F886", "#92F892", "#AAF7AA", "#C3F6C3", "#DBF5DB", "#DBF5DB"];
                g_bubbleColor[6] = ["#00FFFF", "#18FDFD", "#30FCFC", "#49FBFB", "#61FAFA", "#7AF9F9", "#86F8F8", "#92F8F8", "#AAF7F7", "#C3F6F6", "#DBF5F5", "#DBF5F5"];
                g_bubbleColor[7] = ["#FF0000", "#FD1818", "#FC3030", "#FB4949", "#FA6161", "#F97A7A", "#F88686", "#F89292", "#F7AAAA", "#F6C3C3", "#F5DBDB", "#F5DBDB"];
                g_bubbleColor[8] = ["#FF00FF", "#FD18FD", "#FC30FC", "#FB49FB", "#FA61FA", "#F97AF9", "#F886F8", "#F892F8", "#F7AAF7", "#F6C3F6", "#F5DBF5", "#F5DBF5"];
                g_bubbleColor[9] = ["#FFFF00", "#FDFD18", "#FCFC30", "#FBFB49", "#FAFA61", "#F9F97A", "#F8F886", "#F8F892", "#F7F7AA", "#F6F6C3", "#F5F5DB", "#F5F5DB"];
                g_bubbleColor[10] = ["#9999FF", "#A2A2FD", "#ABABFC", "#B4B4FB", "#BDBDFA", "#C6C6F9", "#CBCBF8", "#CFCFF8", "#D8D8F7", "#E1E1F6", "#EAEAF5", "#EAEAF5"];
                g_bubbleColor[11] = ["#99FF99", "#A2FDA2", "#ABFCAB", "#B4FBB4", "#BDFABD", "#C6F9C6", "#CBF8CB", "#CFF8CF", "#D8F7D8", "#E1F6E1", "#EAF5EA", "#EAF5EA"];
                g_bubbleColor[12] = ["#99FFFF", "#A2FDFD", "#ABFCFC", "#B4FBFB", "#BDFAFA", "#C6F9F9", "#CBF8F8", "#CFF8F8", "#D8F7F7", "#E1F6F6", "#EAF5F5", "#EAF5F5"];
                g_bubbleColor[13] = ["#FF9999", "#FDA2A2", "#FCABAB", "#FBB4B4", "#FABDBD", "#F9C6C6", "#F8CBCB", "#F8CFCF", "#F7D8D8", "#F6E1E1", "#F5EAEA", "#F5EAEA"];
                g_bubbleColor[14] = ["#FF99FF", "#FDA2FD", "#FCABFC", "#FBB4FB", "#FABDFA", "#F9C6F9", "#F8CBF8", "#F8CFF8", "#F7D8F7", "#F6E1F6", "#F5EAF5", "#F5EAF5"];
                g_bubbleColor[15] = ["#FFFF99", "#FDFDA2", "#FCFCAB", "#FBFBB4", "#FAFABD", "#F9F9C6", "#F8F8CB", "#F8F8CF", "#F7F7D8", "#F6F6E1", "#F5F5EA", "#F5F5EA"];
                g_bubbleColor[16] = ["#EEEEFF", "#EEEEFD", "#EFEFFC", "#EFEFFB", "#F0F0FA", "#F1F1F9", "#F1F1F8", "#F1F1F8", "#F2F2F7", "#F2F2F6", "#F3F3F5", "#F3F3F5"];
                g_bubbleColor[17] = ["#EEFFEE", "#EEFDEE", "#EFFCEF", "#EFFBEF", "#F0FAF0", "#F1F9F1", "#F1F8F1", "#F1F8F1", "#F2F7F2", "#F2F6F2", "#F3F5F3", "#F3F5F3"];
                g_bubbleColor[18] = ["#EEFFFF", "#EEFDFD", "#EFFCFC", "#EFFBFB", "#F0FAFA", "#F1F9F9", "#F1F8F8", "#F1F8F8", "#F2F7F7", "#F2F6F6", "#F3F5F5", "#F3F5F5"];
                g_bubbleColor[19] = ["#FFEEEE", "#FDEEEE", "#FCEFEF", "#FBEFEF", "#FAF0F0", "#F9F1F1", "#F8F1F1", "#F8F1F1", "#F7F2F2", "#F6F2F2", "#F5F3F3", "#F5F3F3"];
                g_bubbleColor[20] = ["#FFEEFF", "#FDEEFD", "#FCEFFC", "#FBEFFB", "#FAF0FA", "#F9F1F9", "#F8F1F8", "#F8F1F8", "#F7F2F7", "#F6F2F6", "#F5F3F5", "#F5F3F5"];
                g_bubbleColor[21] = ["#FFFFEE", "#FDFDEE", "#FCFCEF", "#FBFBEF", "#FAFAF0", "#F9F9F1", "#F8F8F1", "#F8F8F1", "#F7F7F2", "#F6F6F2", "#F5F5F3", "#F5F5F3"];
                g_bubbleColor[22] = ["#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF", "#E5E5FF"];
                g_bubbleColor[23] = ["#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5", "#E5FFE5"];
                g_bubbleColor[24] = ["#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5", "#FFE5E5"];
                g_bubbleColor[25] = ["#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5", "#FFFFE5"];
                g_bubbleColor[26] = ["#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF", "#E5FFFF"];
                g_bubbleColor[27] = ["#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF", "#FFE5FF"];
                g_bubbleColor[28] = ["#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF", "#FFFFFF"];
                g_bubbleColor[29] = ["#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777", "#777777"];
                g_bubbleColor[30] = ["#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000", "#000000"];
                g_bubbleColor[31] = ["#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF", "#0000FF"];
                g_bubbleColor[32] = ["#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00", "#00FF00"];
                g_bubbleColor[33] = ["#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF", "#00FFFF"];
                g_bubbleColor[34] = ["#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000", "#FF0000"];
                g_bubbleColor[35] = ["#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF", "#FF00FF"];
                g_bubbleColor[36] = ["#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00", "#FFFF00"];
                g_bubbleColor[37] = ["#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF", "#6699FF"];
                g_bubbleColor[38] = ["#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF", "#66FFFF"];
                g_bubbleColor[39] = ["#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66", "#66FF66"];
                g_bubbleColor[40] = ["#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66", "#FFFF66"];
                g_bubbleColor[41] = ["#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666", "#FF6666"];
                g_bubbleColor[42] = ["#FFCCCC", "#FFE6CC", "#FFFFCC", "#E6FFCC", "#CCFFCC", "#CCFFE6", "#CCFFF2", "#CCFFFF", "#CCE5FF", "#CCCCFF", "#E5CCFF", "#FFCCFF"];
                g_bubbleColor[43] = ["#FF0000", "#FF8000", "#FFFF00", "#80FF00", "#00FF00", "#00FF80", "#00FFBF", "#00FFFF", "#007FFF", "#0000FF", "#7F00FF", "#FF00FF"];
                var COLOR_SET_TOTAL_NUM = g_bubbleColor.length;     // 上面g_bubbleColorX的总数，即配色总套数
                var g_colorOpacity = [1.0, 0.95, 0.9, 0.8, 0.7, 0.6, 0.5, 0.4, 0.3, 0.2, 0.1, 0.05, 0];
                var COLOR_OPACITY_TOTAL_NUM = g_colorOpacity.length;
                var g_textColor = ["#000000", "#303030", "#7A7A7A", "#C3C3C3", "#DBDBDB", "#F4F4F4", "#FFFFFF", "#FF0000", "#FF8000", "#FFFF00", "#80FF00", "#00FF00", "#00FF80", "#00FFBF", "#00FFFF", "#007FFF", "#0000FF", "#7F00FF", "#FF00FF", "#FFCCCC", "#FFE6CC", "#FFFFCC", "#E6FFCC", "#CCFFCC", "#CCFFE6", "#CCFFF2", "#CCFFFF", "#CCE5FF", "#CCCCFF", "#E5CCFF", "#FFCCFF"];
                var TEXT_COLOR_TOTAL_NUM = g_textColor.length;   // 上面g_textColor 数组长度
                var g_borderColor = ["#DBDBDB", "#FFFFFF", "#000000", "#F4F4F4", "#C3C3C3", "#868686", "#494949", "#FFCCCC", "#FFE6CC", "#FFFFCC", "#E6FFCC", "#CCFFCC", "#CCFFE6", "#CCFFF2", "#CCFFFF", "#CCE5FF", "#CCCCFF", "#E5CCFF", "#FFCCFF", "#FF0000", "#FF8000", "#FFFF00", "#80FF00", "#00FF00", "#00FF80", "#00FFBF", "#00FFFF", "#007FFF", "#0000FF", "#7F00FF", "#FF00FF", "MULTI-COLOR1", "MULTI-COLOR2"];
                var BORDER_COLOR_TOTAL_NUM = g_borderColor.length;   // 上面g_borderColor 数组长度
                var g_borderWidth = [1, 0, 2, 3, 5, 8, 12, 16, 20, 25, 30, 35, 40, 45, 50];   // 默认宽度为1，不设为0，因为如果为0，则改变边线颜色时看不到
                var BORDER_WIDTH_TOTAL_NUM = g_borderWidth.length;
                var g_backgroundColor = ["#F4F4F4", "#FFFFFF", "#DBDBDB", "#C3C3C3", "#868686", "#494949", "#000000", "#FFCCCC", "#FFE6CC", "#FFFFCC", "#E6FFCC", "#CCFFCC", "#CCFFE6", "#CCFFF2", "#CCFFFF", "#CCE5FF", "#CCCCFF", "#E5CCFF", "#FFCCFF", "#FF0000", "#FF8000", "#FFFF00", "#80FF00", "#00FF00", "#00FF80", "#00FFBF", "#00FFFF", "#007FFF", "#0000FF", "#7F00FF", "#FF00FF"];
                var BACKGROUND_COLOR_TOTAL_NUM = g_backgroundColor.length;
                var g_defautBubbleColor = "#E4E4E4";   // 圆泡泡bubble默认颜色  "#E4E4E4"
                var g_iBubble;

                // 外部关联参量圆泡泡bubble部分全局变量
                var g_oLocX, g_oLocY, g_oLocR, g_oLocW, g_oLocH, g_oFontSize;    // 定位点坐标，像素
                var g_currentBlockID;     // 当前刚被点击的外部参量长方块block的序号。
                var g_oParaID = [0, 1, 2, 3, 4, 5];   // 外部参量圆泡泡bubble的编号。0闲置，从1开始用，为了处理方便。
                var g_blockText0 = ["", "", "", "", "", ""];
                var g_blockText1 = ["", "", "", "", "", ""];
                var g_blockText2 = ["", "", "", "", "", ""];
                var g_blockText3 = ["", "", "", "", "", ""];
                var g_blockLink = ["", "", "", "", "", ""];
                var g_blockPic = ["", "", "", "", "", ""];
                var g_blockColor = ["", "", "", "", "", ""];   // ["#E0E0E0", "#E0E0E0", "#E0E0E0", "#E0E0E0", "#E0E0E0", "#E0E0E0"];// 直接使用圆泡泡bubble配色
                var g_defautBlockColor = "#E0E0E0";   // 圆泡泡bubble默认颜色
                var g_iBlock;

                // 处理编辑历史
                var g_editHistory = [];   // 保存每次编辑后的数据。每次编辑保存后，<DATA_SAVER>中的内容全部push进来
                var EDIT_HISTORY_TATAL_NUM = -1;   // 编辑总次数。初始为-1，表示刚打开文件，没有编辑过，后续设置为 =g_editHistory.length-1
                var g_editHistoryNo = 0;  // 当前编辑历史点。初始 =0，意为原始
                var g_fastStep4Histroy = 1;  // 恢复历史的快进步数，取总数的1/10，最小为1

                // 应该在保存文件时剔除掉的<div>
                // 360等浏览器，会在打开脑图文件时自动加入大量。主要包括：
                // div id="qihooai-assistant-root"
                // div id="ai-assist-root-bangs"
                // 其他如果还有的话，添加到下面的数组中
                // 需要在保存文件时把它增加的内容剔除掉
                var g_divsTobeRemoved = ["qihooai-assistant-root", "ai-assist-root-bangs","ai-assist-root-new"];


                // ********************************************************** 定义与声明结束 ************************************************************


                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************
                // **************************************************************** 主程序开始 *****************************************************************
                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************


                // 确定选择哪种设备模式运行，并设置：电脑或移动设备
                // 从命令行获得强制模式：由命令行参数devmode指定，默认设置为""。"c"=电脑,   "m"=移动设备，  ""= 由isMobileDeviceByTest()确定
                g_devMode = getUrlParam("devmode");
                g_devMode = g_devMode.toLowerCase().trim();

                // 确定使用哪个设备模式，结果保存在 g_inMobileMode 变量
                if (g_devMode == "") {   // 如果未指定，则由程序检测决定
                    if (isMobileDeviceByTest()) {  // 如果程序检测为移动设备
                        g_devMode = "m";      // 此参数在打开上下页ahmm时要传递过去
                    }
                }

                // 根据模式设定参数，m为移动，其他为电脑
                if (g_devMode == "m") {    // 在使用移动模式时，要设定一些参数
                    g_inMobileMode = true;   // 后面程序依此指定的设备模式运行，不管实际是什么设备
                    $("BUTTON_PC_MODE_WELCOME").style.display = "inline";    // 欢迎页面上显示【进入电脑模式】键，隐藏【进入移动模式】键
                    $("BUTTON_MOBILE_MODE_WELCOME").style.display = "none";
                    $("CLICK_LEFT").style.display = "none";   // 隐藏左右两个竖条（用于PC上点击切换前后项）
                    $("CLICK_RIGHT").style.display = "none";

                    // 针对移动设备做特定设置。使用<DIV>缩放来实现移动设备全屏显示。
                    // 前面已使用：<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">，但无法解决屏幕圆角、刘海问题
                    setForMobileDevice();

                } else {    // 电脑模式
                    g_inMobileMode = false;   // 后面程序依此指定的设备模式运行，不管实际是什么设备
                    $("BUTTON_PC_MODE_WELCOME").style.display = "none";    // 欢迎页面上隐藏【进入电脑模式】键，显示【进入移动模式】键
                    $("BUTTON_MOBILE_MODE_WELCOME").style.display = "inline";
                    $("CLICK_LEFT").style.display = "flex";   // 显示左右两个竖条（用于PC上点击切换前后项）
                    $("CLICK_RIGHT").style.display = "flex";

                    // 针对电脑端设定
                    setForPC();
                }

                // 设定系统名称、标题等
                $("BROWSER_TITLE").innerHTML = AHMM_TITLE;   // html文件中的<title>
                $("MAP_TITLE").innerHTML = AHMM_TITLE;   // 页面默认标题
                $("AHMM_VERSION1").innerHTML = "Version " + AHMM_VERSION;   // 主页面显示的版本号
                $("AHMM_VERSION2").innerHTML = "Version " + AHMM_VERSION;   // 使用说明页面显示的版本号
                $("AHMM_VERSION3").innerHTML = "Version " + AHMM_VERSION;   // 欢迎页面显示的版本号
                $("AHMM_VERSION4").innerHTML = "Version " + AHMM_VERSION;   // 封面显示的版本号
                $("AUTHOR_DATE").innerHTML = AHMM_AUTHOR;   // 作者、日期、版权信息

                // 将所有.src设为""，否则保存时会附带文件夹
                $("USE_TIMES").src = "";    // 避免保存时出现file文件夹
                $("FACE_COVER_IMG").src = "";
                $("BACK_COVER_IMG").src = "";
                $("LOGO_PIC_IMG").src = "";
                $("LOGO_PIC_IMG3").src = "";

                var d = new Date(); $("CURRENT_YEAR").innerHTML = d.getFullYear();     // 设置copyright，自动持续到当年

                // 将用于装载显示本地目录、链接图片和html等的DIV清空、隐藏。其中动态包含table或iframe，前者显示图片，后者显示其他
                $("DIV_INNER_FRAME").innerHTML = "";
                $("DIV_INNER_FRAME").style.display = "none";

                // 计算用于显示的基本尺寸，使用1920x1080基准，不要用移动设备实际尺寸，移动设备会根据1920x1080自动缩放
                g_totalWidth = SCREEN_WIDTH_STANDARD - X_MARGIN * 2;  // 阿色全息脑图可使用的总宽度 = 屏幕宽度 - 两边空白
                g_leftWidth = g_totalWidth * LEFT_AREA_RATE;  // 左侧主参量圆泡泡bubble图显示区的宽度
                g_rightWidth = g_totalWidth - g_leftWidth;  // 右侧外联显示区的宽度
                g_totalHeight = SCREEN_HEIGHT_STANDARD - 60;      // 全息脑图的总高度，含标题、底端条，不包括DIV_WHOLE_CANVAS
                g_mainHeight = g_totalHeight - Y_TOPIC_HEIGHT;   // 主参量和外联区的高度 120

                // 处理不同屏幕尺寸：在不同屏幕分辨率时，调整缩放，不必手动设置电脑桌面分辨率。
                // 同一个移动设备在不同浏览器获取的 window.screen.width 值相同，但 window.innerWidth 不同，致使居中显示时有一定差别，比如Chrome和QQ浏览器就不居中。
                // 这个问题是由于手机屏幕圆角或刘海、摄像头所占屏幕引起，Chrome等浏览器在全屏时会将这部分去掉，这样就造成全屏时不全。使用 viewport 也不起作用。
                // 各浏览器无法统一，不必处理。
                // 移动设备自带浏览器一般没有这个问题，所以建议使用自带浏览器。
                g_targetScrnWidth = window.screen.width;  // 实际的目标屏幕宽度，不可使用window.innerWidth。
                g_targetScrnHeight = window.screen.height;  // 高度
                // 如果高度大于宽度，则对换。移动设备屏幕旋转时需要
                if (g_targetScrnHeight > g_targetScrnWidth) {
                    let temp = g_targetScrnWidth;
                    g_targetScrnWidth = g_targetScrnHeight;
                    g_targetScrnHeight = temp;
                }

                // 缩放比例取纵横较小的，这样可以显示全
                g_scrnScl = (g_targetScrnWidth) / SCREEN_WIDTH_STANDARD;
                if (g_scrnScl > ((g_targetScrnHeight) / SCREEN_HEIGHT_STANDARD)) {
                    g_scrnScl = (g_targetScrnHeight) / SCREEN_HEIGHT_STANDARD;
                }
                // 设置脑图整体位置
                $("DIV_ALL").style.top = ((g_targetScrnHeight - SCREEN_HEIGHT_STANDARD * g_scrnScl) / 2) + "px";    // 在不同比例的屏幕上，上下居中
                $("DIV_ALL").style.left = ((g_targetScrnWidth - SCREEN_WIDTH_STANDARD * g_scrnScl) / 2) + "px";    // 在不同比例的屏幕上，左右居中
                // 缩放包含全部的DIV
                $("DIV_ALL").style.transform = "scale(" + g_scrnScl + ")";

                // 设置定位各个div的参数
                g_tmpValue = (SCREEN_WIDTH_STANDARD - 40) + "px";
                $("DIV_WHOLE_CANVAS").style.width = g_tmpValue;
                g_tmpValue = (SCREEN_HEIGHT_STANDARD - 20) + "px";
                $("DIV_WHOLE_CANVAS").style.height = g_tmpValue;
                g_tmpValue = Y_TOPIC_HEIGHT + "px";
                $("DIV_TITLE").style.height = g_tmpValue;
                $("DIV_LOGO_BACK").style.height = g_tmpValue;
                $("DIV_FUNC_BACK").style.height = g_tmpValue;
                g_tmpValue = g_totalWidth + "px";
                $("DIV_WORK").style.width = g_tmpValue;
                g_tmpValue = g_totalHeight + "px";
                $("DIV_WORK").style.height = g_tmpValue;
                g_tmpValue = (g_totalWidth + 2) + "px";
                $("DIV_FOOTER").style.width = g_tmpValue;
                g_tmpValue = Y_FOOTER_HEIGHT + "px";
                $("DIV_FOOTER").style.height = g_tmpValue;

                // 设置绘制圆泡泡bubble的SVG区以及背景图片、边框尺寸
                g_tmpValue = g_totalWidth;
                setAttr("SVG_MAIN", "width", g_tmpValue);
                setAttr("BACK_PIC_IMG", "width", g_tmpValue);
                setAttr("SVG_MAIN_BORDER", "width", g_tmpValue);
                setAttr("SVG_MAIN_RECT_4_NEXTITEM", "width", g_tmpValue);
                g_tmpValue = g_mainHeight;
                setAttr("SVG_MAIN", "height", g_tmpValue);
                setAttr("BACK_PIC_IMG", "height", g_tmpValue);
                setAttr("SVG_MAIN_BORDER", "height", g_tmpValue);
                setAttr("SVG_MAIN_RECT_4_NEXTITEM", "height", g_tmpValue);

                // 从数据区读取全部数据
                readAllData();

                // 显示开始页面（欢迎页面）
                showStartPage();

                // 设置可响应的键盘事件
                setKeyboardCall();

                // 设置可响应的移动设备屏幕事件
                setMobileDeviceScreenCall();

                // 根据ahmm.html后面的命令行参数，确定是打开示例，还是新建
                g_funcMode = getUrlParam("func");  // 从URL获得参数 func
                switch (g_funcMode) {
                    case "1":  // 显示示例，隐藏操作向导
                        startEdit();  // 准备开始
                        setDataForExample();  // 设置示例数据
                        hideShowGuideInfo();  // 隐藏操作向导页
                        exitFromFullScreen();
                        break;
                    case "2": // 新建脑图，显示操作向导
                        startEdit();
                        setDataForNewAHMM();   // 设置新建数据
                        showGuideInfo();
                        exitFromFullScreen();
                        break;
                    case "6": // 复制当前脑图，显示操作向导
                        startEdit();
                        setDataForNewAHMMCopy();   // 设置新建脑图，复制原图数据
                        showGuideInfo();
                        exitFromFullScreen();
                        break;
                    case "7": // 从AI自动生成脑图，显示操作向导
                        startEdit();
                        setDataForAIAHMM();   // 用AI传过来的数据设置脑图
                        showGuideInfo();
                        showAIFinish(); // 显示AI生成完成提示
                        exitFromFullScreen();
                        break;
                    case "3":  // 前后切换文件时，进入编辑状态，不显示欢迎页，隐藏操作向导
                        startEdit();
                        setAllBySavedData();
                        hideShowGuideInfo();
                        exitFromFullScreen();
                        break;
                    case "4":  // 前后切换文件时，进入全屏播放，不显示欢迎页，隐藏操作向导
                        startEdit();
                        setAllBySavedData();
                        hideShowGuideInfo();
                        goIntoFullScreenAndPlay();
                        break;
                    case "5":  // 升级旧文件，不显示欢迎页，隐藏操作向导
                        startEdit();
                        hideShowGuideInfo();
                        showUpdate();
                        break;
                    default:   // 无参数，即直接打开脑图文件
                        exitFromFullScreen();   // 禁止直接进入播放状态
                }

                // 判断是否为新建（包括打开文件时，和在菜单中点“新建全息脑图”），="0"为新建，即未保存过。新建时显示操作向导
                // 保存第一个恢复编辑的历史点
                if (g_bubblesFixedOrRandom == "0") {
                    if (g_funcMode != "2" && g_funcMode != "6") { setDataForNewAHMM(); }   // 避免在菜单中点“新建全息脑图”时重复操作，造成历史恢复多出一个初始点
                    showGuideInfo();
                }
                else {
                    saveAllData();   // 保存恢复编辑的初始点
                    hideShowGuideInfo();
                }

                // 去掉可能存在的高亮
                deHighLightAll();

                // 按照已保存的数据绘制全部
                setAllBySavedData();

                // 如果存在封面，则显示
                showCurrentFaceCover();

                // 如果存在Logo，则显示
                showLogoPic();

                // 如果存在背景图片，则显示
                showBackPicMusic();

                // 显示全部DIV，初始设定为不显示，防止闪烁
                $("DIV_ALL").style.display = "block";

                // 设置欢迎页面上的焦点，新建则默认【新建/编辑键】，否则【播放键】。
                $("BUTTON_PLAY_WELCOME").style.backgroundColor = "";   // 删除可能已经设置focus的键的背景色
                $("BUTTON_EDIT_WELCOME").style.backgroundColor = "";
                if (g_bubblesFixedOrRandom == "0") {
                    $("BUTTON_EDIT_WELCOME").focus();   // 欢迎页新建/编辑键获得焦点，回车即开始
                    $("BUTTON_EDIT_WELCOME").style.backgroundColor = "#FFDDDD";
                }
                else {
                    $("BUTTON_PLAY_WELCOME").focus();   // 欢迎页播放【F10】键获得焦点，回车即开始
                    $("BUTTON_PLAY_WELCOME").style.backgroundColor = "#FFDDDD";
                }

                // 监测浏览器关闭窗口时，提示保存。程序本身右上角使用的【X】和菜单中的【退出当前脑图】与此处无关
                // 在AI自动生成脑图后，如果直接关闭浏览器，则不会提示保存。经尝试，此问题无法解决。使用程序本身右上角使用的【X】和菜单中的【退出当前脑图】没问题。
                window.addEventListener('beforeunload', function (e) {
                    if (g_fileModified == 1) {
                        quitAHMMWithConfirm();
                        e.preventDefault(); // 取消事件的默认动作
                        e.returnValue = ''; // 在Gecko和Trident浏览器中需要设置returnValue属性
                        return ''; // 在Chrome, Safari, 和 IE9+中需要返回字符串
                    }
                });

                // 监听鼠标移动事件。在播放状态，鼠标会被隐藏，此时移动鼠标就会恢复
                document.addEventListener('mousemove', function (event) {
                    restoreHideMouse();
                });

                // 检查最新版本号
                // 从服务器端获得最新版本号。不使用读取服务器端文本文件或html文件形式，这样可避免服务器端配置 CORS（跨源资源共享）策略
                // 采用的办法：(1)在服务器端有版本控制文件  last_version_no.js ，其中有一行代码形如 g_lastVersionNo = "D2012.9.19.x"；
                var g_lastVersionNo = "0";     // 初始设置为“0”。如果从服务器获取成功，=最新版本号，否则="0"
                var g_IncludedScript4Version = document.createElement('script');
                g_IncludedScript4Version.async = true;  // 异步调用
                g_IncludedScript4Version.src = 'http://www.holomind.com.cn/ahmm/last_version_no.js?timestamp=' + new Date().getTime();  // 时间戳用于避免浏览器缓存不变
                $("UPDATE_MARK").style.display = "none";   // 强制先不提示，避免转存的文件，即，非ahmm.html可能会在前面html中设为inline

                g_IncludedScript4Version.onload = function () {  // 如果服务器端的版本成功获得，则检查处理版本号
                    if (g_lastVersionNo != "0") {
                        if (g_lastVersionNo == AHMM_VERSION) {
                            $("UPDATE_MARK").style.display = "none";
                        } else {
                            $("UPDATE_MARK").style.display = "inline";   // 欢迎页面上，检查更新按钮后面显示*
                        }
                    } else {
                        $("UPDATE_MARK").style.display = "none";
                    }
                };

                document.head.appendChild(g_IncludedScript4Version);

                // 2秒后删除前面动态加载的版本控制js文件：避免浏览器保存时生成files文件夹，图像或js代码会被存入该文件夹；避免把动态加载的<script>块保存
                // 如果一直没有加载成功，也不影响用户继续使用，只是浏览器会显示转圈，持续加载大约1分钟
                setTimeout(function () {
                    g_IncludedScript4Version.src = "";
                    document.head.removeChild(g_IncludedScript4Version);
                }, 2000); // 2000毫秒后执行

                // 标记本脑图文件未做过修改
                g_fileModified = 0;

                // 重新放置左右标签，因为其尺寸必须在整个页面渲染完成后才能获得，只能后处理
                resetInMarkOutMark();

                // 如果渐进式播放，先隐藏全部参量泡泡块块，并且必须从概述开始
                // 命令行参数 func=4，即直接进入全屏播放时，如果渐进式播放需要重新隐藏
                if (g_funcMode == "4" && g_sequentialPlay != "") {
                    hideAllBeforePlay();
                    g_currentHighLightNo = -1;   // 进入后一项前会 ++
                }

                // AI生成脑图时，要显示操作向导，要设为未保存过
                if(g_funcMode == "7") {
                    g_fileModified = 1;   // 设置为未保存过
                    showGuideInfo();
                }


                
                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************
                // **************************************************************** 主程序结束 *****************************************************************
                // ********************************************************************************************************************************************
                // ********************************************************************************************************************************************


                // ********************************************************************************************************************************************
                // ***************************************************************** 子程序开始 ****************************************************************
                // ********************************************************************************************************************************************


                // ******************************************************* 系统吸引子和内部序参量部分 *******************************************************

                // ********************************************************* setAllBySavedData *********************************************************
                // 按照已保存的信息摆放所有部件
                function setAllBySavedData() {

                    // 摆放所有泡泡bubble，包括连线
                    setAllBubbles();
                    setAllBubbles();   // 浏览器有时不刷新，执行2次以确保刷新

                    // 摆放所有长方块block
                    setAllBlocks();

                    // 设置脑图标题、链接页、封面/封底、作者、概述、Logo
                    setLogoTitleAuthorGenWords();

                    // 设置背景颜色
                    setBackgroundColor();

                    // 如果编辑窗口打开，设置当前泡泡和块块高亮
                    if ($("EDIT_INNER_PARA_BOX").style.display == "block") { markCurrentBubble(); }
                    if ($("EDIT_OUTER_PARA_BOX").style.display == "block") { markCurrentBlock(); }

                }  // function 结束

                // *********************************************** randSetBubblesAndResetALLBySavedData ************************************************
                // 随机摆放所有圆泡泡bubble和连线，属性不改动
                function randSetBubblesAndResetALLBySavedData( updown ) {
                    // uodown 标志按的键是上箭头还是下箭头，只在故事线模式时使用。0：上，其他：下

                    var rdm, totalGridsX, totalGridsY, useGrids, useGridBgnX, useGridBgnY, useGridEndX, useGridEndY, pxPerGrid;
                    var i, j, scl, rscl, lx, ly, allowPut;

                    // 概述透明度：仅在泡泡是透明的时候设置为0.9，否则设为1；不随泡泡变化。
                    if (g_colorOpacity[g_colorOpacityNo] < 1.0) {
                        $("GEN_WORDS_BOX").style.opacity = "0.9";
                    } else {
                        $("GEN_WORDS_BOX").style.opacity = "1";
                    }

                    // 摆放泡泡：星形模式时，随机摆放；故事线模式时，整齐摆放。
                    if (!(g_storyLine.trim() != "")) {   // 星形模式

                        // 将整个可以摆放圆泡泡bubble的区域划分为正方形的网格，用二维数组表示网格
                        totalGridsX = GRIDS_NUBER;
                        pxPerGrid = Math.floor(g_leftWidth / totalGridsX);
                        totalGridsX = Math.floor(g_leftWidth / pxPerGrid);
                        totalGridsY = Math.floor((g_mainHeight - 50) / pxPerGrid);

                        // 初始化定位数组，充0，表示未被占用
                        for (i = 0; i < totalGridsX; i++) {          // 一维长度
                            g_gridsArray[i] = new Array(i);          // 声明二维
                            for (j = 0; j < totalGridsY; j++) {      // 二维长度
                                g_gridsArray[i][j] = 0;              // 置0，表示未被占用
                            }
                        }

                        // 摆放系统吸引子圆泡泡bubble
                        scl = 1.0;  // 相当于圆泡泡bubble的半径，已归一化，最大为1
                        lx = 0.45;
                        ly = 0.3;
                        rscl = scl * 0.1 * 2;
                        useGrids = Math.round(totalGridsX * rscl);
                        useGridBgnX = Math.round(totalGridsX * lx - useGrids / 2);
                        useGridBgnY = Math.round(totalGridsY * ly - useGrids / 2);
                        useGridEndX = Math.round(useGridBgnX + useGrids);
                        useGridEndY = Math.round(useGridBgnY + useGrids);

                        // 将占用的网格数组标为1
                        for (i = useGridBgnX; i < useGridEndX; i++) {
                            for (j = useGridBgnY; j < useGridEndY; j++) {
                                g_gridsArray[i][j] = 1;            // 置1，表示占用
                            }
                        }

                        // 记录摆放系统吸引子圆泡泡bubble的参数，先不摆放，后面统一摆放
                        g_bubbleX[0] = lx;
                        g_bubbleY[0] = ly;

                        // 下面开始摆放其他圆泡泡bubble
                        for (g_iBubble = 1; g_iBubble < g_iParaID.length; g_iBubble++) {

                            // 随机摆一个圆泡泡bubble，不能重叠已经摆上的
                            scl = g_bubbleScl[g_iBubble];    // 相当于圆泡泡bubble的半径，已归一化，最大为1
                            allowPut = 0;
                            var n = 0;
                            while (allowPut == 0 && n < TRY_TIMES) {
                                n++;
                                lx = Math.random();   // 0~1
                                ly = Math.random();
                                rscl = scl * 0.1 * 2;
                                useGrids = Math.round(totalGridsX * rscl);
                                useGridBgnX = Math.round(totalGridsX * lx - useGrids / 2);
                                useGridBgnY = Math.round(totalGridsY * ly - useGrids / 2);
                                useGridEndX = Math.round(useGridBgnX + useGrids);
                                useGridEndY = Math.round(useGridBgnY + useGrids);

                                if (!(useGrids < 0 || useGridBgnX < 0 || useGridBgnY < 0 ||
                                    useGridEndX > (totalGridsX - Math.ceil(X_OFFSET / pxPerGrid)) ||
                                    useGridEndY > (totalGridsY - Math.ceil(Y_OFFSET / pxPerGrid))))      // 判断：如果不溢出框
                                {
                                    allowPut = 1;
                                    for (i = useGridBgnX; i < useGridEndX; i++) {
                                        for (j = useGridBgnY; j < useGridEndY; j++) {
                                            if (g_gridsArray[i][j] == 1) {
                                                allowPut = 0;    // 已被占用，不允许摆放
                                                break;
                                                break;
                                            }
                                        }   // for j
                                    }   // for i
                                }   // if
                            }   // while

                            // 将占用的网格数组标为1
                            for (i = useGridBgnX; i < useGridEndX; i++) {
                                for (j = useGridBgnY; j < useGridEndY; j++) {
                                    g_gridsArray[i][j] = 1;            // 置1，表示占用
                                }
                            }

                            // 记录圆泡泡bubble的参数，后面统一划出
                            g_bubbleX[g_iBubble] = lx;
                            g_bubbleY[g_iBubble] = ly;

                        }   // for g_iBubble

                    } else {     // 故事线模式
                        
                        var BubbleX1 = [0.09, 0.34, 0.59, 0.84, 0.09, 0.34, 0.59, 0.84, 0.09, 0.34, 0.59, 0.84];
                        var BubbleY1 = [0.09, 0.09, 0.09, 0.09, 0.31, 0.31, 0.31, 0.31, 0.53, 0.53, 0.53, 0.53];

                        var BubbleX2 = [0.09, 0.34, 0.59, 0.84, 0.84, 0.59, 0.34, 0.09, 0.09, 0.34, 0.59, 0.84];
                        var BubbleY2 = [0.09, 0.09, 0.09, 0.09, 0.31, 0.31, 0.31, 0.31, 0.53, 0.53, 0.53, 0.53];

                        var BubbleX3 = [0.09, 0.34, 0.59, 0.84, 0.84, 0.84, 0.59, 0.34, 0.09, 0.09, 0.34, 0.59];
                        var BubbleY3 = [0.09, 0.09, 0.09, 0.09, 0.31, 0.53, 0.53, 0.53, 0.53, 0.31, 0.31, 0.31];

                        var BubbleX4 = [0.09, 0.09, 0.09, 0.34, 0.34, 0.34, 0.59, 0.59, 0.59, 0.84, 0.84, 0.84];
                        var BubbleY4 = [0.09, 0.31, 0.53, 0.09, 0.31, 0.53, 0.09, 0.31, 0.53, 0.09, 0.31, 0.53];

                        var BubbleX5 = [0.09, 0.09, 0.09, 0.34, 0.34, 0.34, 0.59, 0.59, 0.59, 0.84, 0.84, 0.84];
                        var BubbleY5 = [0.09, 0.31, 0.53, 0.53, 0.31, 0.09, 0.09, 0.31, 0.53, 0.53, 0.31, 0.09];

                        var BubbleX6 = [0.09, 0.09, 0.09, 0.34, 0.59, 0.84, 0.84, 0.84, 0.59, 0.34, 0.34, 0.59];
                        var BubbleY6 = [0.09, 0.31, 0.53, 0.53, 0.53, 0.53, 0.31, 0.09, 0.09, 0.09, 0.31, 0.31];

                        var BubbleX7 = [0.09, 0.09, 0.09, 0.34, 0.59, 0.84, 0.84, 0.59, 0.34, 0.34, 0.59, 0.84];
                        var BubbleY7 = [0.09, 0.31, 0.53, 0.53, 0.53, 0.53, 0.31, 0.31, 0.31, 0.09, 0.09, 0.09];

                        var BubbleX8 = [0.34, 0.59, 0.84, 0.84, 0.59, 0.34, 0.09, 0.09, 0.09, 0.34, 0.59, 0.84];
                        var BubbleY8 = [0.31, 0.31, 0.31, 0.09, 0.09, 0.09, 0.09, 0.31, 0.53, 0.53, 0.53, 0.53];

                        var BubbleX9 = [0.34, 0.59, 0.84, 0.84, 0.59, 0.34, 0.09, 0.09, 0.09, 0.34, 0.59, 0.84];
                        var BubbleY9 = [0.31, 0.31, 0.31, 0.53, 0.53, 0.53, 0.53, 0.31, 0.09, 0.09, 0.09, 0.09];

                        var BubbleX10 = [0.34, 0.59, 0.59, 0.34, 0.09, 0.09, 0.09, 0.34, 0.59, 0.84, 0.84, 0.84];
                        var BubbleY10 = [0.31, 0.31, 0.09, 0.09, 0.09, 0.31, 0.53, 0.53, 0.53, 0.53, 0.31, 0.09];

                        var BubbleX11 = [0.34, 0.59, 0.59, 0.34, 0.09, 0.09, 0.09, 0.34, 0.59, 0.84, 0.84, 0.84];
                        var BubbleY11 = [0.31, 0.31, 0.53, 0.53, 0.53, 0.31, 0.09, 0.09, 0.09, 0.09, 0.31, 0.53];
                        
                        g_arrangeTotalNum = 11;   // 上面数据集的个数

                        // 重排脑图泡泡使用XY位置数组的编号，1-tNum 循环
                        if (updown == 0) {   // 0 表示上箭头
                            g_arrangeNo ++;   
                        } else {
                            g_arrangeNo --; 
                        }
                        if (g_arrangeNo > g_arrangeTotalNum) {g_arrangeNo = 1;}
                        if (g_arrangeNo < 1) {g_arrangeNo = g_arrangeTotalNum;}

                        switch (g_arrangeNo) {
                            case 1:  
                                g_bubbleX = BubbleX1;
                                g_bubbleY = BubbleY1;    
                                break;
                            case 2:  
                                g_bubbleX = BubbleX2;
                                g_bubbleY = BubbleY2;    
                                break;
                            case 3:  
                                g_bubbleX = BubbleX3;
                                g_bubbleY = BubbleY3;    
                                break;
                            case 4:  
                                g_bubbleX = BubbleX4;
                                g_bubbleY = BubbleY4;    
                                break;
                            case 5:  
                                g_bubbleX = BubbleX5;
                                g_bubbleY = BubbleY5;    
                                break;
                            case 6:  
                                g_bubbleX = BubbleX6;
                                g_bubbleY = BubbleY6;    
                                break;
                            case 7:  
                                g_bubbleX = BubbleX7;
                                g_bubbleY = BubbleY7;    
                                break;
                            case 8:  
                                g_bubbleX = BubbleX8;
                                g_bubbleY = BubbleY8;    
                                break;
                            case 9:  
                                g_bubbleX = BubbleX9;
                                g_bubbleY = BubbleY9;    
                                break;
                            case 10:  
                                g_bubbleX = BubbleX10;
                                g_bubbleY = BubbleY10;    
                                break;
                            case 11:  
                                g_bubbleX = BubbleX11;
                                g_bubbleY = BubbleY11;    
                                break;
                        }

                    }

                    // 摆放泡泡之间的连接线
                    setAllLinkLines();

                    // 统一摆放所有圆泡泡bubble
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {
                        var nText = g_iBubble == 0 ? "系统吸引子 @" : "内部序参量 " + g_iParaID[g_iBubble];
                        setSingleBubble(g_bubbleX[g_iBubble], g_bubbleY[g_iBubble], g_iParaID[g_iBubble], g_bubbleScl[g_iBubble], nText, g_bubbleText1[g_iBubble], g_bubbleText2[g_iBubble], g_bubbleText3[g_iBubble], g_bubbleText4[g_iBubble], g_bubbleLink[g_iBubble], g_bubblePic[g_iBubble], g_bubbleColor[g_colorSetNo][g_iBubble]);
                    }

                    // 摆放所有长方块block
                    setAllBlocks();

                    // 设置脑图标题、链接页、封面、作者、概述、Logo
                    setLogoTitleAuthorGenWords();

                    // 设置背景颜色
                    setBackgroundColor();

                    // 如果编辑窗口打开，设置当前泡泡和块块高亮
                    if ($("EDIT_INNER_PARA_BOX").style.display == "block") { markCurrentBubble(); }
                    if ($("EDIT_OUTER_PARA_BOX").style.display == "block") { markCurrentBlock(); }

                }  // function 结束



                // *********************************************************** setAllBubbles ***********************************************************
                // 按照已保存的信息摆放所有泡泡
                function setAllBubbles() {

                    // 处理渐次播放。只在渐次播放时，需要确定最大显示到哪里，没到的泡泡及其连线不显示
                    if (g_inFullScreen && g_sequentialPlay != "") { // 全屏播放，并且渐次式播放
                        g_maxPlayNo = g_maxHighLightNo;   // g_maxHighLightNo 保存 g_currentHighLightNo 的最大值。g_currentHighLightNo变量值：概述为0，  吸引子为1，内部序参量1为2、11为12，   外部参量1为13、5为17。
                        if (g_maxPlayNo > g_iParaID.length) { g_maxPlayNo = g_iParaID.length; }
                    } else {
                        g_maxPlayNo = g_iParaID.length;   // g_iParaID.length:泡泡总数
                    }

                    // 摆放泡泡之间的连接线
                    setAllLinkLines();


                    // 统一摆放所有圆泡泡bubble，调用setSingleBubble()
                    for (g_iBubble = 0; g_iBubble < g_maxPlayNo; g_iBubble++) {
                        var nText = g_iBubble == 0 ? "系统吸引子 @" : "内部序参量 " + g_iParaID[g_iBubble];
                        setSingleBubble(g_bubbleX[g_iBubble], g_bubbleY[g_iBubble], g_iParaID[g_iBubble], g_bubbleScl[g_iBubble], nText, g_bubbleText1[g_iBubble], g_bubbleText2[g_iBubble], g_bubbleText3[g_iBubble], g_bubbleText4[g_iBubble], g_bubbleLink[g_iBubble], g_bubblePic[g_iBubble], g_bubbleColor[g_colorSetNo][g_iBubble]);
                    }

                }  // function 结束


                // *********************************************************** setAllLinkLines *********************************************************
                // 按照已保存的信息摆放所有连接线
                function setAllLinkLines() {
                    // 统一摆放所有圆泡泡bubble之间的连线。先显示连线，它们处在所有泡泡下面
                    var x1, y1, x2, y2, xa, ya, xb, yb, sina, cosa, l, m, n, dx1, dy1, dx2, dy2,r1, r2, t;
                    var preNum = 1;   // 在存在隐藏的泡泡时，前几个泡泡是显示的。正常为1，两个显示的泡泡之间有几个隐藏的

                    for (g_iBubble = 1; g_iBubble < g_iParaID.length; g_iBubble++) {

                        // 隐藏的泡泡的连线，要越过，连前一个泡泡
                        if (g_bubbleText0[g_iBubble].toLowerCase().indexOf("(hide)") != -1) {  // 如果隐藏
                            preNum += 1;  // 泡泡编号跳过
                        } else {   // 如果是显示状态
                            if (g_storyLine.trim() != "") {
                                x1 = g_leftWidth * g_bubbleX[g_iBubble - preNum] + X_OFFSET;
                                y1 = g_mainHeight * g_bubbleY[g_iBubble - preNum] + Y_OFFSET;
                            } else {
                                x1 = g_leftWidth * g_bubbleX[0] + X_OFFSET;
                                y1 = g_mainHeight * g_bubbleY[0] + Y_OFFSET;
                            }
                            
                            x2 = g_leftWidth * g_bubbleX[g_iBubble] + X_OFFSET;
                            y2 = g_mainHeight * g_bubbleY[g_iBubble] + Y_OFFSET;

                            // 计算泡泡边到边连线坐标，不是圆心到圆心
                            // 计算各个泡泡的半径
                            // 如果是故事线模式，则泡泡半径统一到一致，否则，星形模式半径各不相同。在此基础上再乘以特意缩放的比例
                            if (g_storyLine.trim() != "") {
                                r1 = g_leftWidth * 0.1 * SCALE_FOR_STORY_MODE * g_bubbleScale[g_iBubble - 1];
                                r2 = g_leftWidth * 0.1 * SCALE_FOR_STORY_MODE * g_bubbleScale[g_iBubble];
                            } else
                            {
                                r1 = g_leftWidth * 0.1 * g_bubbleScl[0]  * g_bubbleScale[g_iBubble - 1];
                                r2 = g_leftWidth * 0.1 * g_bubbleScl[g_iBubble] * g_bubbleScale[g_iBubble];
                            }
                            // 半径加上泡泡的边线宽度
                            r1 += g_borderWidth[g_borderWidthNo] / 2;
                            r2 += g_borderWidth[g_borderWidthNo] / 2;
                            // 半径加大一点，避免连线两端被泡泡遮挡
                            r1 += 5;
                            r2 += 10;
                            // 在直角坐标系中，利用坐标计算连线起止点
                            l = Math.sqrt((x2-x1) * (x2-x1) + (y2-y1) * (y2-y1)) - 10;  // 10是泡泡边框离箭头的距离，不让箭头接上泡泡
                            m = y2 - y1;
                            n = x2 - x1;
                            ya = y1;
                            xa = x1;
                            sina = m / l;
                            cosa = n / l;
                            dy2 = r2 * sina;
                            yb = y2 - dy2;
                            dx2 = r2 * cosa;
                            xb = x2 -dx2;
                            // 向左上偏移2点，因为泡泡有偏移
                            xa -= 2;
                            xb -= 2;
                            ya -= 2;
                            yb -= 2;

                            // 设置连线坐标
                            g_tmpID = "LN" + g_iBubble;
                            g_tmpValue = xa;
                            setAttr(g_tmpID, "x1", g_tmpValue);
                            g_tmpValue = ya;
                            setAttr(g_tmpID, "y1", g_tmpValue);
                            g_tmpValue = xb;
                            setAttr(g_tmpID, "x2", g_tmpValue);
                            g_tmpValue = yb;
                            setAttr(g_tmpID, "y2", g_tmpValue);
                            // 设置连线宽度
                            g_tmpValue = g_borderWidth[g_borderWidthNo];
                            g_tmpValue = (g_tmpValue <= 0) ? 1 : g_tmpValue;
                            setAttr(g_tmpID, "stroke-width", g_tmpValue);
                            // 设置连线颜色
                            g_tmpValue = g_borderColor[g_borderColorNo];
                            if (g_tmpValue == "MULTI-COLOR1") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 1][g_iBubble]; }  // 多彩色模式使用泡泡的彩色填充色
                            if (g_tmpValue == "MULTI-COLOR2") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 2][g_iBubble]; }  // 多彩色模式使用泡泡的彩色填充色
                            setAttr(g_tmpID, "stroke", g_tmpValue);
                            // 设置箭头涂颜色
                            var marker = document.getElementById("arrow" + g_iBubble);  // 获取<marker>元素
                            var path = marker.querySelector("path");   // 获取<marker>内的<path>元素
                            path.setAttribute("fill", g_tmpValue); // 改为与连线相同的当前颜色
                            if (g_colorOpacity[g_colorOpacityNo] < 1.0) {   // 如果配色是透明的，则不显示连线
                                $(g_tmpID).style.display = "none";
                            }
                            else {
                                if (g_iBubble < g_maxPlayNo) { $(g_tmpID).style.display = "block"; }  // 渐次播放时，仅显示已显示过的连线
                            }
                            preNum = 1;
                        }    // if 显示的泡泡

                    }  // for

                }


                // *********************************************************** setAllBlocks ************************************************************
                // 按照已保存的信息摆放所有长方块
                function setAllBlocks() {

                    // 只在渐次播放时，需要确定最大显示到哪里，没到的块块不显示
                    var g_maxPlayNo;
                    if (g_inFullScreen && g_sequentialPlay != "") { // 全屏播放，并且渐次式播放
                        g_maxPlayNo = g_maxHighLightNo - 12 + 1;   // g_maxHighLightNo 保存 g_currentHighLightNo 的最大值。g_currentHighLightNo变量值：概述为0，  吸引子为1，内部序参量1为2、11为12，   外部参量1为13、5为17。数组[0]闲置，所以+1
                        if (g_maxPlayNo > g_oParaID.length) { g_maxPlayNo = g_oParaID.length; }
                    } else {
                        g_maxPlayNo = g_oParaID.length;   // 泡泡总数
                    }

                    // 统一摆放所有长方块block
                    for (g_iBlock = 1; g_iBlock < g_maxPlayNo; g_iBlock++) {
                        setSingleBlock(g_iBlock, g_blockText1[g_iBlock], g_blockText2[g_iBlock], g_blockText3[g_iBlock], g_blockLink[g_iBlock], g_blockPic[g_iBlock], g_bubbleColor[g_colorSetNo][(g_iBlock - 1) * 2 + 1]); // 使用泡泡配色
                    }

                }  // function 结束


                // ***************************************************** setLogoTitleAuthorGenWords ****************************************************
                // 按照已保存的信息填写脑图标题、链接页、封面、作者、概述、Logo、背景图片、背景音乐、渐进式播放
                function setLogoTitleAuthorGenWords() {

                    // 读取全息脑图标题数据并设置脑图标题和浏览器标题
                    var strT, tID;

                    strT = g_mapTitle;
                    tID = "MAP_TITLE";
                    $(tID).innerHTML = strT;
                    tID = "BROWSER_TITLE";
                    var n = strT.indexOf("ahmm");
                    $(tID).innerHTML = strT;
                    if (n == -1) {
                        $(tID).innerHTML = "ahmm-" + strT.replace(/\s/g, "_");   // 保存html时去掉空格，否则很多地方不兼容
                    }

                    // 读取链接页、封面/封底并设置
                    g_menuBarWidth = 245;
                    g_menuBarLeft = 1556;
                    g_menuCharLeft = 1523;

                    $("prev_page").value = g_prevPage;
                    if (g_prevPage == "" || g_inFullScreen) {
                        $("PREV_PAGE").style.display = "none";  // 隐藏上一页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("PREV_PAGE").style.display = "";  // 显示上一页图标
                    }

                    $("next_page").value = g_nextPage;
                    if (g_nextPage == "" || g_inFullScreen) {
                        $("NEXT_PAGE").style.display = "none";  // 隐藏下一页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("NEXT_PAGE").style.display = "";  // 显示下一页图标
                    }

                    $("home_page").value = g_homePage;
                    if (g_homePage == "" || g_inFullScreen) {
                        $("HOME_PAGE").style.display = "none";  // 隐藏起始页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("HOME_PAGE").style.display = "";  // 显示起始页图标
                    }

                    $("DIV_FUNC").style.width = g_menuBarWidth + "px";
                    $("DIV_FUNC").style.left = g_menuBarLeft + "px";
                    $("MENU_CHAR").style.left = g_menuCharLeft + "px";

                    // 只有设置Logo时，在changeLogo()中设置g_saveLogoPicOrNot =1，此处根据该值=1时才设置Logo src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    if (g_saveLogoPicOrNot == 1) {
                        $("logo_pic").value = g_logoPic;
                        $("LOGO_PIC_IMG").src = g_logoPic;
                    }
                    g_saveLogoPicOrNot = 0;

                    // 只有设置背景图片时，在changeBackPicMusic()中设置g_saveBackPicOrNot =1，此处根据该值=1时才设置背景图片 src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    if (g_saveBackPicOrNot == 1) {
                        $("back_pic").value = g_backPic;
                        setAttr("BACK_PIC_IMG", "href", g_backPic);
                    }
                    g_saveBackPicOrNot = 0;

                    // 只有设置背景音乐时，在changeBackPicMusic()中设置g_saveBackMusicOrNot =1，此处根据该值=1时才设置背景图片 src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    if (g_saveBackMusicOrNot == 1) {
                        $("back_music").value = g_backMusic;
                        $("BACK_MUSIC").src = g_backMusic;
                    }
                    g_saveBackMusicOrNot = 0;

                    // 只有设置封面时，在changeTitle()中设置g_saveFaceCoverOrNot =1，此处根据该值=1时才设置封面src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    if (g_saveFaceCoverOrNot == 1) {
                        $("face_cover").value = g_faceCover;
                        $("FACE_COVER_IMG").src = g_faceCover;
                    }
                    g_saveFaceCoverOrNot = 0;

                    // 只有设置封底时，在changeTitle()中设置g_saveBackCoverOrNot =1，此处根据该值=1时才设置封面src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    if (g_saveBackCoverOrNot == 1) {
                        $("back_cover").value = g_backCover;
                        $("BACK_COVER_IMG").src = g_backCover;
                    }
                    g_saveBackCoverOrNot = 0;

                    // 读取概述并设置
                    processGenWords();

                    // 读取作者
                    tID = "AUTHOR_DATE";
                    $(tID).innerHTML = g_authorDate;

                    // 读取左右标签，并设置
                    // 左标签
                    tID = "IN_MARK";
                    $(tID).innerHTML = g_inMark;

                    // 右标签
                    tID = "OUT_MARK";
                    $(tID).innerHTML = g_outMark;

                }  // function 结束


                // ********************************************************** resetInMarkOutMark *******************************************************
                // 重新放置左右标签的文字，因为其尺寸必须在整个页面渲染完成后才能获得，只能后处理
                function resetInMarkOutMark() {

                    var tID, markBBox, markHeight, markTop;

                    // 左标签
                    tID = "IN_MARK";
                    markBBox = $(tID).getBBox();   // 创建一个SVGRect对象，用于存储文本的边界框
                    markHeight = markBBox.height;  // 获取文本的高度
                    markTop = 354 + 180 / 2 - markHeight / 2 - 2;
                    if (markTop < 355) { markTop = 355; }
                    setAttr(tID, "y", markTop);

                    // 右标签
                    tID = "OUT_MARK";
                    markBBox = $(tID).getBBox();   // 创建一个SVGRect对象，用于存储文本的边界框
                    markHeight = markBBox.height;  // 获取文本的高度
                    markTop = 354 + 180 / 2 - markHeight / 2 - 2;
                    if (markTop < 355) { markTop = 355; }
                    setAttr(tID, "y", markTop);

                }


                // *********************************************************** processGenWords *********************************************************
                // 处理概述，概述中有 [+概述]，把它和后面文字分开，作为概述的标题
                function processGenWords() {

                    // 处理概述窗口
                    var t_g_genWords;

                    // 概述透明度：仅在泡泡是透明的时候设置为0.9，否则设为1；不随泡泡变化。
                    if (g_colorOpacity[g_colorOpacityNo] < 1.0) {
                        $("GEN_WORDS_BOX").style.opacity = "0.9";
                    } else {
                        $("GEN_WORDS_BOX").style.opacity = "1";
                    }

                    g_genWordsText = g_genWords;
                    t_g_genWords = g_genWords.trim();

                    // 提取[+概述]
                    g_genWordsTitle = "";
                    var i, l;
                    i = 0;
                    l = t_g_genWords.length;

                    if (t_g_genWords.substr(0, 1) == "[") {
                        i++;
                        while (i < l && t_g_genWords.substr(i, 1) != "]") {
                            i++;
                        }
                        if (t_g_genWords.substr(i, 1) == "]") {
                            g_genWordsTitle = t_g_genWords.substr(1, i - 1);
                            g_genWordsText = t_g_genWords.substr(i + 1, l);
                        }
                    }

                    $("GEN_WORDS_TITLE").innerHTML = g_genWordsTitle;
                    $("GEN_WORDS_TEXT").innerHTML = g_genWordsText;
                    setAttr("GEN_WORDS_SVG", "width", "" + (g_genWordsTitle.length + 1) * 40);

                }


                // ********************************************************* setBackgroundColor ********************************************************
                // 按照已保存的信息设置背景颜色
                function setBackgroundColor() {

                    // 读取背景颜色
                    tID = "SVG_MAIN";
                    $(tID).style.backgroundColor = g_backgroundColor[g_backgroundColorNo];

                }  // function 结束


                // ********************************************************** setSingleBubble **********************************************************
                // 摆放一个圆泡泡bubble和内容
                function setSingleBubble(x, y, no, scl, id, s1, s2, s3, s4, lk, pic, cl) {

                    // x,y: 圆心位置，是归一化的值，最大为1——此时位于最右边。半径r，标准为g_leftWidth*0.1
                    // no是第几个序参量，吸引子的no=0，其他1~9。id是标签id。
                    // s1~s4: 4行文字。scl：圆泡泡bubble大小比例，最大的是吸引子，为1;其他逐渐减小，比如0.8。lk：url。pic：图片。cl：颜色。

                    var bubbleNo, noColor;
                    var dx, dy, l, r;
                    var tStr, tID;

                    // 如果是故事线模式，则将所有泡泡都设置为统一大小，尺寸由 SCALE_FOR_STORY_MODE 设定。
                    if (g_storyLine.trim() != "") {scl = SCALE_FOR_STORY_MODE;}

                    r = 0.1;     // 图形尺寸比例，意思是半径等于绘图区宽度的1/10。

                    if (cl.trim() == "") {
                        cl = g_defautBubbleColor;
                    }

                    // 摆放圆圈主体及阴影
                    g_iLocR = g_leftWidth * r * scl;

                    if (g_colorOpacity[g_colorOpacityNo] < 1.0) {
                        g_r_Scale = R_SCALE_FOR_OPACITY;
                        $('CR_' + no + '_1').style.display = "none";
                    }
                    else {
                        g_r_Scale = 1.0;
                        $('CR_' + no + '_1').style.display = "block";
                    }
                    g_iLocR = g_iLocR * g_r_Scale;
                    g_iLocX = g_leftWidth * x + X_OFFSET - g_iLocR - INNER_OFFSET + 80;
                    g_iLocY = g_mainHeight * y + Y_OFFSET - g_iLocR - INNER_OFFSET + Y_TOPIC_HEIGHT;

                    // DIV和SVG层
                    g_tmpValue = g_iLocR * 2 + 25;
                    g_tmpID = "DIV_IN_" + no;
                    $(g_tmpID).style.width = g_tmpValue + "px";
                    $(g_tmpID).style.height = g_tmpValue + "px";
                    $(g_tmpID).style.left = g_iLocX + "px";
                    $(g_tmpID).style.top = g_iLocY + "px";
                    g_tmpID = 'SVG_' + no;
                    setAttr(g_tmpID, "width", g_tmpValue);
                    setAttr(g_tmpID, "height", g_tmpValue);

                    // 阴影
                    g_tmpID = 'CR_' + no + '_1';
                    g_tmpValue = g_iLocR + INNER_OFFSET + CIRCLE_SHADOW_OFFSET;
                    setAttr(g_tmpID, "cx", g_tmpValue);
                    g_tmpValue = g_iLocR + INNER_OFFSET + CIRCLE_SHADOW_OFFSET;
                    setAttr(g_tmpID, "cy", g_tmpValue);
                    g_tmpValue = g_iLocR;
                    setAttr(g_tmpID, "r", g_tmpValue);
                    g_tmpValue = "#969696";
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    g_tmpValue = g_borderColor[g_borderColorNo];
                    setAttr(g_tmpID, "opacity", g_tmpValue);
                    setAttr(g_tmpID, "stroke", g_tmpValue);

                    // 圆圈主体
                    g_tmpID = 'CR_' + no + '_2';
                    g_tmpValue = g_iLocR + INNER_OFFSET;   // g_iLocX;
                    setAttr(g_tmpID, "cx", g_tmpValue);
                    g_tmpValue = g_iLocR + INNER_OFFSET; // g_iLocY;
                    setAttr(g_tmpID, "cy", g_tmpValue);
                    g_tmpValue = g_iLocR;
                    setAttr(g_tmpID, "r", g_tmpValue);
                    g_tmpValue = cl;
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    g_tmpValue = g_borderColor[g_borderColorNo];
                    if (g_tmpValue == "MULTI-COLOR1") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 1][no]; }  // 多彩色模式使用泡泡的彩色填充色
                    if (g_tmpValue == "MULTI-COLOR2") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 2][no]; }
                    setAttr(g_tmpID, "stroke", g_tmpValue);
                    g_tmpValue = (g_borderUsed == 0) ? 0 : g_borderWidth[g_borderWidthNo];
                    setAttr(g_tmpID, "stroke-width", g_tmpValue);
                    g_tmpValue = g_colorOpacity[g_colorOpacityNo];
                    setAttr(g_tmpID, "opacity", g_tmpValue);
                    setAttr(g_tmpID, "stroke-dasharray", "1, 0");

                    // 彩虹高亮圆圈
                    g_tmpID = 'CR_' + no + '_3';
                    g_tmpValue = g_iLocR + INNER_OFFSET;   // g_iLocX;
                    setAttr(g_tmpID, "cx", g_tmpValue);
                    g_tmpValue = g_iLocR + INNER_OFFSET; // g_iLocY;
                    setAttr(g_tmpID, "cy", g_tmpValue);
                    g_tmpValue = g_iLocR;
                    setAttr(g_tmpID, "r", g_tmpValue);

                    // 图片
                    g_tmpID = "I_P" + no + "_PIC";
                    g_tmpValue = ($("SVG_" + no).getAttribute('width') - $(g_tmpID).getAttribute('width')) / 2;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = ($("SVG_" + no).getAttribute('height') - $(g_tmpID).getAttribute('height')) / 2;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    // 如果是故事线模式，图片大小是统一的。280 是吸引子的图片尺寸，各个泡泡尺寸=280*比例
                    if (g_storyLine.trim() != "") {
                        setAttr(g_tmpID, "width", 280 * SCALE_FOR_STORY_MODE);
                        setAttr(g_tmpID, "height", 280 * SCALE_FOR_STORY_MODE);
                    } else {  // 设置星形模式图片尺寸
                        switch (no) {
                            case 0:  
                                setAttr(g_tmpID, "width", 280);
                                setAttr(g_tmpID, "height", 280);    
                                break;
                            case 1:  
                                setAttr(g_tmpID, "width", 250);
                                setAttr(g_tmpID, "height", 250);    
                                break;
                            case 2:  
                                setAttr(g_tmpID, "width", 235);
                                setAttr(g_tmpID, "height", 235);    
                                break;
                            case 3:  
                                setAttr(g_tmpID, "width", 205);
                                setAttr(g_tmpID, "height", 205);    
                                break;
                            case 4:  
                                setAttr(g_tmpID, "width", 190);
                                setAttr(g_tmpID, "height", 190);    
                                break;
                            case 5:  
                                setAttr(g_tmpID, "width", 175);
                                setAttr(g_tmpID, "height", 175);    
                                break;
                            case 6:  
                                setAttr(g_tmpID, "width", 160);
                                setAttr(g_tmpID, "height", 160);    
                                break;
                            case 7:  
                                setAttr(g_tmpID, "width", 145);
                                setAttr(g_tmpID, "height", 145);    
                                break;
                            case 8:  
                                setAttr(g_tmpID, "width", 130);
                                setAttr(g_tmpID, "height", 130);    
                                break;
                            case 9:  
                                setAttr(g_tmpID, "width", 116);
                                setAttr(g_tmpID, "height", 116);    
                                break;
                            case 10:  
                                setAttr(g_tmpID, "width", 86);
                                setAttr(g_tmpID, "height", 86);    
                                break;
                            case 11:  
                                setAttr(g_tmpID, "width", 72);
                                setAttr(g_tmpID, "height", 72);    
                                break;
                        }
                    }
                    setAttr(g_tmpID, "href", g_bubblePic[no]);
                    if (g_bubblePic[no].trim() == "") {
                        setAttr(g_tmpID, "style", "display: none;");
                    } else {
                        setAttr(g_tmpID, "style", "display: block;");
                        g_tmpValue = g_colorOpacity[g_colorOpacityNo];  // 图片透明度与泡泡相同
                        setAttr(g_tmpID, "opacity", g_tmpValue);
                    }

                    // 摆放内部序参量编号和系统吸引子（no=0）
                    tStr = '  ';  // @的字体特殊处理一下
                    if (no == 0) {
                        bubbleNo = "@";
                        noColor = ATTRACTOR_COLOR;
                        g_iFontSize = g_leftWidth / 30 * scl;
                        tStr = "";
                    }
                    else {
                        bubbleNo = "[" + no + "]";
                        noColor = g_textColor[g_textColorNo];
                        g_iFontSize = g_leftWidth / 50 * scl;
                    }

                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 2.0 + 5;
                    tID = "I_P" + no + "_T0";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = noColor;
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText0[no];

                    // 摆放吸引子核心词：第1行及阴影
                    g_iFontSize = g_leftWidth / 25 * scl;
                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 1.4 + INNER_OFFSET + g_iFontSize * 0.3;

                    // 文字阴影
                    tID = "I_P" + no + "_T1_1";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX + TEXT_SHADOW_OFFSET;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY + TEXT_SHADOW_OFFSET;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = "#999999";
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText1[no];

                    // 文字主体
                    tID = "I_P" + no + "_T1_2";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText1[no];

                    // 摆放第2行
                    g_iFontSize = g_leftWidth / 40 * scl;
                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 0.85 + INNER_OFFSET;
                    tID = "I_P" + no + "_T2";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText2[no];

                    // 摆放第3行
                    g_iFontSize = g_leftWidth / 60 * scl;
                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 0.7 + INNER_OFFSET;
                    tID = "I_P" + no + "_T3";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText3[no];

                    // 摆放第4行
                    g_iFontSize = g_leftWidth / 75 * scl;
                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 0.61 + INNER_OFFSET;
                    tID = "I_P" + no + "_T4";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_bubbleText4[no];

                    // 设置 ... 和背景红色方块
                    g_iFontSize = g_leftWidth / 80 * scl;
                    g_iLocX = g_iLocR + INNER_OFFSET;
                    g_iLocY = g_iLocR / 0.54 + INNER_OFFSET;
                    tID = "I_P" + no + "_T5";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    setAttr(g_tmpID + "_2", "x", g_tmpValue - g_iFontSize * 0.9);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue);
                    setAttr(g_tmpID + "_2", "y", g_tmpValue - g_iFontSize * 0.75);
                    g_tmpValue = 23 / g_bubbleScale[no];   // 统一将...设置为23px，便于小的泡泡的编辑。g_bubbleScale[no]为该泡泡单独缩放比例，此处需要消除它的影响，保持大小不随着缩放变化
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    // 如果是故事线模式，将红色小方块统一尺寸。27和22是吸引子中红方块的尺寸，各个泡泡按比例设定。
                    if (g_storyLine.trim() != "") { 
                        setAttr(g_tmpID + "_2", "width", 27 * SCALE_FOR_STORY_MODE); 
                        setAttr(g_tmpID + "_2", "height", 22 * SCALE_FOR_STORY_MODE);
                    } else {  // 设置星形模式红色小方块尺寸
                        switch (no) {
                            case 0:  
                                setAttr(g_tmpID + "_2", "width", 27);
                                setAttr(g_tmpID + "_2", "height", 22);    
                                break;
                            case 1:  
                                setAttr(g_tmpID + "_2", "width", 25);
                                setAttr(g_tmpID + "_2", "height", 20);    
                                break;
                            case 2:  
                                setAttr(g_tmpID + "_2", "width", 23);
                                setAttr(g_tmpID + "_2", "height", 18);    
                                break;
                            case 3:  
                                setAttr(g_tmpID + "_2", "width", 21);
                                setAttr(g_tmpID + "_2", "height", 16);    
                                break;
                            case 4:  
                                setAttr(g_tmpID + "_2", "width", 19);
                                setAttr(g_tmpID + "_2", "height", 15);    
                                break;
                            case 5:  
                                setAttr(g_tmpID + "_2", "width", 17);
                                setAttr(g_tmpID + "_2", "height", 14);    
                                break;
                            case 6:  
                                setAttr(g_tmpID + "_2", "width", 16);
                                setAttr(g_tmpID + "_2", "height", 13);    
                                break;
                            case 7:  
                                setAttr(g_tmpID + "_2", "width", 15);
                                setAttr(g_tmpID + "_2", "height", 13);    
                                break;
                            case 8:  
                                setAttr(g_tmpID + "_2", "width", 14);
                                setAttr(g_tmpID + "_2", "height", 12);    
                                break;
                            case 9:  
                                setAttr(g_tmpID + "_2", "width", 13);
                                setAttr(g_tmpID + "_2", "height", 11);    
                                break;
                            case 10:  
                                setAttr(g_tmpID + "_2", "width", 12);
                                setAttr(g_tmpID + "_2", "height", 10);    
                                break;
                            case 11:  
                                setAttr(g_tmpID + "_2", "width", 11);
                                setAttr(g_tmpID + "_2", "height", 9);    
                                break;
                        }
                    }

                    // 设置超链接标记»»»，放在...上面
                    tID = "I_P" + no + "_LM";
                    g_tmpID = tID;
                    g_tmpValue = g_iLocX;
                    setAttr(g_tmpID, "x", g_tmpValue);
                    g_tmpValue = g_iLocY;
                    setAttr(g_tmpID, "y", g_tmpValue - g_iFontSize * 0.8);
                    g_tmpValue = g_iFontSize;
                    setAttr(g_tmpID, "font-size", g_tmpValue);
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);

                    // 设置链接。此处只设置链接的光标、存在链接的标记，实际的链接地址在后面 拖动/单击 代码中设置
                    if (no == 0) {
                        g_tmpID = "SYS_ATTRACTOR";
                    }
                    else {
                        g_tmpID = "INNER_PARA_" + no;
                    }

                    if ((lk.trim().replace("(sw)", "")).replace("(af)", "") != "") {    // (sw) 表示在父窗口(当前标签页)打开，默认带(sw)，即父窗口(当前标签页)打开；(af) 表示图片自动适应，默认带(af)，即自动适应
                        $(g_tmpID).setAttribute("style", "cursor:pointer;");
                        $(tID).setAttribute("style", "display:inline;");
                    }
                    else {
                        $(g_tmpID).setAttribute("style", "cursor:default;");
                        $(tID).setAttribute("style", "display:none;");
                    }

                    // 按缩放比例显示
                    $("DIV_IN_" + no).style.transform = "scale(" + g_bubbleScale[no] + ")";

                    // 显示或隐藏泡泡。把标记(hide)的泡泡隐藏，连同连线
                    if (g_bubbleText0[no].toLowerCase().indexOf("(hide)") == -1) {   // 当前泡泡没有设为隐藏
                        $("DIV_IN_" + no).style.display = "block";
                        if (g_colorOpacity[g_colorOpacityNo] < 1.0) {   // 如果配色是透明的，则不显示连线
                            $("LN" + no).style.display = "none";
                        }
                        else {
                            $("LN" + no).style.display = "block";
                        }
                    } else {  // 当前泡泡被设为隐藏
                        $("DIV_IN_" + no).style.display = "none";
                        $("LN" + no).style.display = "none";
                    }

                }   // function 结束，  摆放一个内部序参量圆泡泡bubble子程序结束


                // ********************************************************** setSingleBlock ***********************************************************
                // 摆放一个长方块block和内容
                function setSingleBlock(no, s1, s2, s3, lk, pic, cl) {

                    // x,y: 圆心位置，是归一化的值，最大为1——此时位于最右边。半径r，标准为g_leftWidth*0.1
                    // no是第几个序参量，吸引子的no=0，其他1~9。id是标签id。
                    // s1~s4: 4行文字。scl：圆泡泡bubble大小比例，最大的是吸引子，为1;其他逐渐减小，比如0.8。lk：url。cl：颜色。

                    var tID;

                    if (g_colorOpacity[g_colorOpacityNo] < 1.0) {
                        $('RT_' + no + '_1').style.display = "none";
                    }
                    else {
                        $('RT_' + no + '_1').style.display = "block";
                    }

                    // 摆放长方块block主体及阴影
                    // 长方块block主体
                    g_tmpID = 'RT_' + no + '_2';
                    g_tmpValue = cl;
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    g_tmpValue = g_borderColor[g_borderColorNo];
                    if (g_tmpValue == "MULTI-COLOR1") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 1][(no - 1) * 2 + 1]; }  // 多彩色模式使用泡泡的彩色填充色
                    if (g_tmpValue == "MULTI-COLOR2") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 2][(no - 1) * 2 + 1]; }
                    setAttr(g_tmpID, "stroke", g_tmpValue);
                    g_tmpValue = (g_borderUsed == 0) ? 0 : g_borderWidth[g_borderWidthNo];
                    setAttr(g_tmpID, "stroke-width", g_tmpValue);
                    g_tmpValue = g_colorOpacity[g_colorOpacityNo];
                    setAttr(g_tmpID, "opacity", g_tmpValue);
                    setAttr(g_tmpID, "stroke-dasharray", "1, 0");

                    // 图片
                    g_tmpID = "O_P" + no + "_PIC";
                    setAttr(g_tmpID, "href", g_blockPic[no]);
                    if (g_blockPic[no].trim() == "") {
                        setAttr(g_tmpID, "style", "display: none;");
                    } else {
                        setAttr(g_tmpID, "style", "display: block;");
                    }

                    // 摆放编号
                    tID = "O_P" + no + "_T0";
                    g_tmpID = tID;
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_blockText0[no];

                    // 摆放关联词：第1行
                    // 阴影
                    tID = "O_P" + no + "_T1_1";
                    g_tmpID = tID;
                    $(g_tmpID).innerHTML = g_blockText1[no];
                    // 文字主体
                    tID = "O_P" + no + "_T1_2";
                    g_tmpID = tID;
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_blockText1[no];

                    // 摆放第2行
                    tID = "O_P" + no + "_T2";
                    g_tmpID = tID;
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_blockText2[no];

                    // 摆放第3行
                    tID = "O_P" + no + "_T3";
                    g_tmpID = tID;
                    g_tmpValue = g_textColor[g_textColorNo];
                    setAttr(g_tmpID, "fill", g_tmpValue);
                    $(g_tmpID).innerHTML = g_blockText3[no];

                    // 设置连接。与内部参量不同，此处直接设置链接地址。内部参量的链接地址因为存在拖动，无法直接设置。
                    g_tmpID = "OUTER_PARA_" + no;
                    tID = "O_P" + no + "_LM";   // 链接标记 »»»
                    if ((lk.trim().replace("(sw)", "")).replace("(af)", "") != "") {    // (sw) 表示在父窗口(当前标签页)打开，默认带(sw)，即父窗口(当前标签页)打开；(af) 表示图片自动适应，默认带(af)，即自动适应
                        $(g_tmpID).setAttribute("style", "cursor:pointer;");
                        $(g_tmpID).setAttribute("onclick", "openFirstInnerLink('" + lk.trim() + "');");
                        $(tID).setAttribute("style", "display:inline;");
                    }
                    else {
                        $(g_tmpID).setAttribute("style", "cursor:default;");
                        $(g_tmpID).setAttribute("onclick", "");
                        $(tID).setAttribute("style", "display:none;");
                    }

                }   // function 结束，  摆放一个外部关联参量块块block子程序结束


                // ************************************************************ readAllData ************************************************************
                // 从本文件头部隐藏的数据区读取已保存的数据，放入内存，更新svg元素的数据
                function readAllData() {

                    var tDataId;

                    // 读取数据是否保存过，用于判定：如果没有保存过则随机摆放泡泡，否则固定摆放。0表示没有
                    tDataId = "P_D_SAVED";
                    g_bubblesFixedOrRandom = $(tDataId).innerHTML + "";
                    g_bubblesFixedOrRandom = (g_bubblesFixedOrRandom == "1") ? "1" : "0";

                    // 读取Logo数据
                    tDataId = "P_D_LOGO_PIC";
                    g_logoPic = $(tDataId).innerHTML;

                    // 读取背景图片数据
                    tDataId = "P_D_BACK_PIC";
                    g_backPic = $(tDataId).innerHTML;

                    // 读取背景音乐数据
                    tDataId = "P_D_BACK_MUSIC";
                    g_backMusic = $(tDataId).innerHTML;

                    // 读取全息脑图标题、链接页等数据
                    tDataId = "P_D_TITLE";
                    g_mapTitle = $(tDataId).innerHTML;
                    tDataId = "P_D_PREVPAGE";
                    g_prevPage = $(tDataId).innerHTML;
                    tDataId = "P_D_NEXTPAGE";
                    g_nextPage = $(tDataId).innerHTML;
                    tDataId = "P_D_HOMEPAGE";
                    g_homePage = $(tDataId).innerHTML;
                    tDataId = "P_D_FACECOVER";
                    g_faceCover = $(tDataId).innerHTML;
                    tDataId = "P_D_BACKCOVER";
                    g_backCover = $(tDataId).innerHTML;
                    tDataId = "P_D_SEQUENTIAL_PLAY";
                    g_sequentialPlay = $(tDataId).innerHTML;
                    tDataId = "P_D_SHOW_TIME";
                    g_showTimeWhenPlay = $(tDataId).innerHTML;
                    tDataId = "P_D_STORY_LINE";
                    g_storyLine = $(tDataId).innerHTML;

                    // 读取是否隐藏制作支持信息
                    tDataId = "P_D_HIDE_SUPPORT";
                    g_hideSupportInfo = myString2IntNumber($(tDataId).innerHTML);  // 转为数字

                    // 读取概述
                    tDataId = "P_D_GEN_WORDS";
                    g_genWords = $(tDataId).innerHTML;

                    // 读取作者
                    tDataId = "P_D_AUTHOR";
                    g_authorDate = $(tDataId).innerHTML;

                    // 读取左标签
                    tDataId = "P_D_IN_MARK";
                    g_inMark = $(tDataId).innerHTML;

                    // 读取右标签
                    tDataId = "P_D_OUT_MARK";
                    g_outMark = $(tDataId).innerHTML;

                    // 读颜色系列号，选中实际使用的数组
                    tDataId = "P_D_COLOR_SET_NO";
                    g_colorSetNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 块块的颜色使用泡泡的
                    for (g_iBlock = 0; g_iBlock < g_oParaID.length; g_iBlock++) {
                        g_blockColor[g_iBlock] = g_bubbleColor[g_colorSetNo][g_iBlock * 2]; // 借用圆泡泡bubble颜色
                    }

                    // 读颜色透明度
                    tDataId = "P_D_COLOR_OPACITY_NO";
                    g_colorOpacityNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 读文本颜色
                    tDataId = "P_D_TEXT_COLOR_NO";
                    g_textColorNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 读边线颜色
                    tDataId = "P_D_BORDER_COLOR_NO";
                    g_borderColorNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 读边线线型
                    tDataId = "P_D_BORDER_WIDTH_NO";
                    g_borderWidthNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 读背景颜色
                    tDataId = "P_D_BACKGROUND_COLOR_NO";
                    g_backgroundColorNo = myString2IntNumber($(tDataId).innerHTML + "");

                    // 读取各个圆泡泡bubble的参数
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {
                        tDataId = "I_D_" + g_iBubble + "_X";
                        g_bubbleX[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_Y";
                        g_bubbleY[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_TEXT0";
                        g_bubbleText0[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_TEXT1";
                        g_bubbleText1[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_TEXT2";
                        g_bubbleText2[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_TEXT3";
                        g_bubbleText3[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_TEXT4";
                        g_bubbleText4[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_LINK";
                        g_bubbleLink[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_PIC";
                        g_bubblePic[g_iBubble] = $(tDataId).innerHTML;
                        tDataId = "I_D_" + g_iBubble + "_SCALE";
                        g_bubbleScale[g_iBubble] = $(tDataId).innerHTML;
                    }   // for g_iBubble

                    // 读取各个外部关联参量长方块block的参数
                    for (g_iBlock = 1; g_iBlock < g_oParaID.length; g_iBlock++) {
                        tDataId = "O_D_" + g_iBlock + "_TEXT0";
                        g_blockText0[g_iBlock] = $(tDataId).innerHTML;
                        tDataId = "O_D_" + g_iBlock + "_TEXT1";
                        g_blockText1[g_iBlock] = $(tDataId).innerHTML;
                        tDataId = "O_D_" + g_iBlock + "_TEXT2";
                        g_blockText2[g_iBlock] = $(tDataId).innerHTML;
                        tDataId = "O_D_" + g_iBlock + "_TEXT3";
                        g_blockText3[g_iBlock] = $(tDataId).innerHTML;
                        tDataId = "O_D_" + g_iBlock + "_LINK";
                        g_blockLink[g_iBlock] = $(tDataId).innerHTML;
                        tDataId = "O_D_" + g_iBlock + "_PIC";
                        g_blockPic[g_iBlock] = $(tDataId).innerHTML;
                    }   // for g_iBlock

                }


                // ************************************************************ saveAllData ************************************************************
                // 从显示的HTML、SVG和内存获取圆泡泡bubble和长方块block图形数据，存入本文件头部隐藏的数据区 DATA_SAVER
                function saveAllData() {

                    var tDataId, tID;

                    // 从上次保存后文件是否修改过，用于退出时提醒确认
                    g_fileModified = 1;

                    // Bubbles是否保存过，即已存在，如果没存过，则表示为新建
                    tDataId = "P_D_SAVED";
                    $(tDataId).innerHTML = "1";       // 程序运行中，g_bubblesFixedOrRandom存储该值

                    // Logo信息
                    tDataId = "P_D_LOGO_PIC";
                    $(tDataId).innerHTML = g_logoPic;

                    // 背景图片信息
                    tDataId = "P_D_BACK_PIC";
                    $(tDataId).innerHTML = g_backPic;

                    // 背景音乐信息
                    tDataId = "P_D_BACK_MUSIC";
                    $(tDataId).innerHTML = g_backMusic;

                    // 全息脑图标题、链接页信息
                    tDataId = "P_D_TITLE";
                    $(tDataId).innerHTML = g_mapTitle;
                    tDataId = "P_D_PREVPAGE";
                    $(tDataId).innerHTML = g_prevPage;
                    tDataId = "P_D_NEXTPAGE";
                    $(tDataId).innerHTML = g_nextPage;
                    tDataId = "P_D_HOMEPAGE";
                    $(tDataId).innerHTML = g_homePage;
                    tDataId = "P_D_FACECOVER";
                    $(tDataId).innerHTML = g_faceCover;
                    tDataId = "P_D_BACKCOVER";
                    $(tDataId).innerHTML = g_backCover;
                    tDataId = "P_D_SEQUENTIAL_PLAY";
                    $(tDataId).innerHTML = g_sequentialPlay;
                    tDataId = "P_D_SHOW_TIME";
                    $(tDataId).innerHTML = g_showTimeWhenPlay;
                    tDataId = "P_D_STORY_LINE";
                    $(tDataId).innerHTML = g_storyLine;

                    // 是否隐藏制作支持信息
                    tDataId = "P_D_HIDE_SUPPORT";
                    $(tDataId).innerHTML = g_hideSupportInfo;

                    // 概述
                    tID = "GEN_WORDS_TEXT";
                    tDataId = "P_D_GEN_WORDS";
                    $(tDataId).innerHTML = g_genWords;

                    // 作者
                    tID = "AUTHOR_DATE";
                    tDataId = "P_D_AUTHOR";
                    $(tDataId).innerHTML = g_authorDate;

                    // 左标签
                    tID = "IN_MARK";
                    tDataId = "P_D_IN_MARK";
                    $(tDataId).innerHTML = $(tID).innerHTML;

                    // 右标签
                    tID = "OUT_MARK";
                    tDataId = "P_D_OUT_MARK";
                    $(tDataId).innerHTML = $(tID).innerHTML;

                    // 颜色系列号
                    tDataId = "P_D_COLOR_SET_NO";
                    $(tDataId).innerHTML = g_colorSetNo + "";

                    // 颜色透明度
                    tDataId = "P_D_COLOR_OPACITY_NO";
                    $(tDataId).innerHTML = g_colorOpacityNo + "";

                    // 文本颜色
                    tDataId = "P_D_TEXT_COLOR_NO";
                    $(tDataId).innerHTML = g_textColorNo + "";

                    // 边线颜色
                    tDataId = "P_D_BORDER_COLOR_NO";
                    $(tDataId).innerHTML = g_borderColorNo + "";

                    // 边线线型
                    tDataId = "P_D_BORDER_WIDTH_NO";
                    $(tDataId).innerHTML = g_borderWidthNo + "";

                    // 背景颜色
                    tDataId = "P_D_BACKGROUND_COLOR_NO";
                    $(tDataId).innerHTML = g_backgroundColorNo + "";

                    // 内部序参量
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {

                        tDataId = "I_D_" + g_iBubble + "_X";
                        $(tDataId).innerHTML = g_bubbleX[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_Y";
                        $(tDataId).innerHTML = g_bubbleY[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_TEXT0";
                        $(tDataId).innerHTML = g_bubbleText0[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_TEXT1";
                        $(tDataId).innerHTML = g_bubbleText1[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_TEXT2";
                        $(tDataId).innerHTML = g_bubbleText2[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_TEXT3";
                        $(tDataId).innerHTML = g_bubbleText3[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_TEXT4";
                        $(tDataId).innerHTML = g_bubbleText4[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_LINK";
                        $(tDataId).innerHTML = g_bubbleLink[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_PIC";
                        $(tDataId).innerHTML = g_bubblePic[g_iBubble];

                        tDataId = "I_D_" + g_iBubble + "_SCALE";
                        $(tDataId).innerHTML = g_bubbleScale[g_iBubble];

                    }   // for

                    // 外部关联参量
                    for (g_iBlock = 1; g_iBlock < g_oParaID.length; g_iBlock++) {

                        tDataId = "O_D_" + g_iBlock + "_TEXT0";
                        $(tDataId).innerHTML = g_blockText0[g_iBlock];

                        tDataId = "O_D_" + g_iBlock + "_TEXT1";
                        $(tDataId).innerHTML = g_blockText1[g_iBlock];

                        tDataId = "O_D_" + g_iBlock + "_TEXT2";
                        $(tDataId).innerHTML = g_blockText2[g_iBlock];

                        tDataId = "O_D_" + g_iBlock + "_TEXT3";
                        $(tDataId).innerHTML = g_blockText3[g_iBlock];

                        tDataId = "O_D_" + g_iBlock + "_LINK";
                        $(tDataId).innerHTML = g_blockLink[g_iBlock];

                        tDataId = "O_D_" + g_iBlock + "_PIC";
                        $(tDataId).innerHTML = g_blockPic[g_iBlock];

                    }   // for

                    // 基因信息
                    if ($("P_D_SELF_ID").innerHTML.trim() == "0" && EDIT_HISTORY_TATAL_NUM != -1) {  // 当ID=0，即初始AHMM，或者为老版本，EDIT_HISTORY_TATAL_NUM != -1表示编辑过：都将做为第1代处理

                        $("P_D_SELF_ID").innerHTML = generateUUIDLikeID();  // 生成UUID
                        $("P_D_SELF_GENERATION").innerHTML = "1";           // 设为第1代

                        if (g_bubblesFixedOrRandom == "1") {   // 老版本，g_bubblesFixedOrRandom="1"表示保存过的文件，即不是新建的
                            $("P_D_SELF_CREATION_TIME").innerHTML = "2022-09-19 00:00:00";   // 统一设置创建时间
                            $("P_D_SELF_CREATION_VERSION").innerHTML = "Version D2022.9.19.9";   // 统一设置创建时AHMM的版本
                        } else {   // 新建脑图文件
                            $("P_D_SELF_CREATION_TIME").innerHTML = getFormattedDateTime();   // 设置为当前时间
                            $("P_D_SELF_CREATION_VERSION").innerHTML = AHMM_VERSION;   // 设置为当前AHMM的版本号
                        }

                        $("P_D_FATHER_ID").innerHTML = "0";
                        $("P_D_FATHER_TITLE").innerHTML = "大系统观阿色全息脑图AHMM";
                        $("P_D_FATHER_INFO").innerHTML = "自由使用 自由复制 自由分享 / 版权所有: 阿色";
                    }

                    if (EDIT_HISTORY_TATAL_NUM != -1) {
                        $("P_D_SELF_LAST_TIME").innerHTML = getFormattedDateTime();      // 如果发生了编辑，则将当前时间设为最后更新时间
                    }

                    // 保存编辑历史
                    saveEditHistory();

                }  // function 结束，保存数据


                // ********************************************************** saveEditHistory **********************************************************
                // 把数据区每次保存的数据，依次压入内存，供恢复编辑使用。每次saveAllData()都会调用本函数一次，每一次即为一次保存/恢复点。
                function saveEditHistory() {

                    g_editHistory.push($("DATA_SAVER").innerHTML);   // 将数据区<DATA_SAVER>全部内容压入
                    
                    EDIT_HISTORY_TATAL_NUM = g_editHistory.length - 1;   // 编辑总次数，从0开始，0表示原始
                    g_editHistoryNo = EDIT_HISTORY_TATAL_NUM;        // 某一个编辑历史点编号，表示当前位置
                    if (EDIT_HISTORY_TATAL_NUM > 10) { g_fastStep4Histroy = 2; }   // 快进时，步长取整
                    if (EDIT_HISTORY_TATAL_NUM > 20) { g_fastStep4Histroy = 5; }
                    if (EDIT_HISTORY_TATAL_NUM > 50) { g_fastStep4Histroy = 10; }
                    if (EDIT_HISTORY_TATAL_NUM > 100) { g_fastStep4Histroy = 20; }
                    if (EDIT_HISTORY_TATAL_NUM > 200) { g_fastStep4Histroy = 50; }
                    if (EDIT_HISTORY_TATAL_NUM > 500) { g_fastStep4Histroy = 100; }
                    if (EDIT_HISTORY_TATAL_NUM > 1000) { g_fastStep4Histroy = 200; }
                    if (EDIT_HISTORY_TATAL_NUM > 2000) { g_fastStep4Histroy = 500; }
                    if (EDIT_HISTORY_TATAL_NUM > 5000) { g_fastStep4Histroy = 1000; }
                    if (EDIT_HISTORY_TATAL_NUM > 10000) { g_fastStep4Histroy = 2000; }
                    if (EDIT_HISTORY_TATAL_NUM > 20000) { g_fastStep4Histroy = 5000; }
                    if (EDIT_HISTORY_TATAL_NUM > 50000) { g_fastStep4Histroy = 10000; }
                    if (EDIT_HISTORY_TATAL_NUM > 100000) { g_fastStep4Histroy = Math.ceil(EDIT_HISTORY_TATAL_NUM / 10); }
                    // 动态修改恢复历史窗口中的历史点数据
                    $("MENU_TEXT3").innerHTML = "当前编号：" + (parseInt(g_editHistoryNo)) + "/" + EDIT_HISTORY_TATAL_NUM;

                }


                // ****************************************************** restoreEditHistory2Point *****************************************************
                // 从内存恢复到指定的保存/恢复点。iSavePoint为欲恢复到的保存/恢复点的序号：0为初始，即文件未做任何修改时
                // 恢复时不显示封面，以免干扰用户
                function restoreEditHistory2Point(iSavePoint) {

                    // 保存当前恢复点位，显示当前点位
                    g_editHistoryNo = iSavePoint;
                    $("MENU_TEXT3").innerHTML = "当前编号：" + (parseInt(g_editHistoryNo)) + "/" + EDIT_HISTORY_TATAL_NUM;

                    // 将内存中的历史点恢复到数据存储区<DATA_SAVER>
                    $("DATA_SAVER").innerHTML = g_editHistory[iSavePoint];

                    // 从数据区读取全部数据
                    readAllData();

                    // 去掉可能存在的高亮
                    deHighLightAll();

                    // 按照已保存的数据绘制全部
                    setAllBySavedData();

                    // 如果存在Logo，则显示
                    showLogoPic();

                    // 如果存在背景图片，则显示
                    showBackPicMusic();

                    // 重新放置左右标签，因为其尺寸必须在整个页面渲染完成后才能获得，只能后处理
                    resetInMarkOutMark();

                }


                // ********************************************************** setDataForExample ********************************************************
                // 为“全息脑图”示例设置参数
                function setDataForExample() {

                    var BubbleText0Example = ["@", "[1]", "[2]", "[3]", "[4]", "[5]", "[6]", "[7]", "[8]", "", "", ""];
                    var BubbleText1Example = ["全息脑图", "全息", "脑图", "吸引子", "内部序参量", "外部关联参量", "升维思考", "阿色", "黄金序律", "", "", ""];
                    var BubbleText2Example = [
                        "新型思维工具",
                        "系统的结构性信息",
                        "Mind Map，即思维导图",
                        "系统的核心和灵魂",
                        "表征/规定系统性质的参量",
                        "相关但不主导系统性质",
                        "多维度/角度/尺度 超时空",
                        "全息脑图创立者",
                        "把握事物用7个序参量",
                        "", "", ""
                    ];

                    var BubbleText3Example = [
                        "透过表象抓本质 透过数据找规律",
                        "多/高维信息 元信息 局部=整体",
                        "图示化的思维工具",
                        "承载系统的全息、使命",
                        "主导系统或事物的属性和行为",
                        "全息脑图中指【关联词】",
                        "目标太大太小都会迷失",
                        "本软件作者",
                        "1个核心/2~3个关键/3~5个主要",
                        "", "", ""
                    ];

                    var BubbleText4Example = [
                        "要抓大放小 不要事无巨细",
                        "例：架构/元数据/知识/智慧/规律",
                        "全息脑图是发掘本质的思维导图",
                        "是系统存在的意义和依据",
                        "全息脑图中指【主题词】",
                        "",
                        "跳出三界外 不在五行中",
                        "",
                        "",
                        "", "", ""
                    ];

                    var BubbleLinkExample = [
                        "(af)https://v.youku.com/v_show/id_XMjQ3MjQ0MzAyMA==.html",
                        "(sw)(af)https://baike.baidu.com/item/%E5%85%A8%E6%81%AF%E5%AE%87%E5%AE%99%E7%90%86%E8%AE%BA/1671840?fr=aladdin",
                        "(sw)(af)https://baike.baidu.com/item/%E6%80%9D%E7%BB%B4%E5%AF%BC%E5%9B%BE/563801?fr=aladdin",
                        "(af)https://v.youku.com/v_show/id_XMTU2NjU5MzM0MA==.html?spm=a2hbt.13141534.1_2.d_13&scm=20140719.manual.114461.video_XMTU2NjU5MzM0MA==",
                        "(sw)(af)https://baike.baidu.com/item/%E5%8D%8F%E5%90%8C%E5%AD%A6/481834?fr=aladdin",
                        "",
                        "",
                        "",
                        "",
                        "", "", ""
                    ];

                    var BubblePicExample = ["", "", "", "", "", "", "", "", "", "", "", ""];

                    var BubbleScaleExample = ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1"];

                    var BlockText0Example = ["空置未用", "[1]", "[2]", "[3]", "[4]", "[5]"];
                    var BlockText1Example = ["空置未用", "《大系统观》", "序参量/主要矛盾", "全息照片(真全息)", "制作软件", "阿色寄语"];
                    var BlockText2Example = ["空置未用",
                        "全息有机系统论看待世界",
                        "热力学和协同学基本概念",
                        "底片碎片可显示整个影像",
                        "AHMM：全息思想编制",
                        "诚挚欢迎批评指正！"
                    ];
                    var BlockText3Example = ["空置未用",
                        "免费开源电子书，百度可得",
                        "支配系统行为，主宰系统演化",
                        "记录光波的振幅、频率和相位",
                        "神奇：HTML具有保存数据能力",
                        "免费开源 共同开发 迭代精进"
                    ];

                    var BlockLinkExample = ["空置未用",
                        "(sw)(af)http://www.holomind.com.cn/bsv/%E5%A4%A7%E7%B3%BB%E7%BB%9F%E8%A7%82-A1.0(20160214-aqw)%E5%8F%91%E5%B8%83%E7%A8%BF.pdf",
                        "(sw)(af)https://baike.baidu.com/item/%E5%8D%8F%E5%90%8C%E5%AD%A6/481834?fr=aladdin",
                        "(sw)(af)https://baike.baidu.com/item/%E5%85%A8%E6%81%AF%E7%85%A7%E7%89%87/198667?fr=aladdin",
                        "(af)https://www.cnblogs.com/BigSystemsView/p/16694399.html",
                        ""
                    ];

                    var BlockPicExample = ["", "", "", "", "", ""];

                    var BubbleX = [0.45, 0.246, 0.668, 0.835, 0.690, 0.886, 0.142, 0.06, 0.272, 0.433, 0.579, 0.793];
                    var BubbleY = [0.3, 0.406, 0.432, 0.449, 0.151, 0.235, 0.175, 0.50, 0.156, 0.543, 0.043, 0.107];

                    var tDataId;

                    // 数据是否保存过
                    g_bubblesFixedOrRandom = "1";

                    // Logo数据
                    g_logoPic = "";
                    $("logo_pic").value = g_logoPic;

                    // 背景图片数据
                    g_backPic = "";
                    $("back_pic").value = g_backPic;

                    // 背景音乐数据
                    g_backMusic = "";
                    $("back_music").value = g_backMusic;

                    // 全息脑图标题、链接页数据
                    g_mapTitle = "什么是全息脑图？What's AHMM？";
                    g_prevPage = "";
                    g_nextPage = "";
                    g_homePage = "";
                    g_faceCover = "";
                    g_backCover = "";
                    g_sequentialPlay = "";
                    g_showTimeWhenPlay = "";
                    g_storyLine = "";
                    $("MAP_TITLE").innerHTML = g_mapTitle;
                    $("map_title").value = g_mapTitle;
                    $("prev_page").value = g_prevPage;
                    $("next_page").value = g_nextPage;
                    $("home_page").value = g_homePage;
                    $("face_cover").value = g_faceCover;
                    $("back_cover").value = g_backCover;
                    $("sequential_play").checked = false;
                    $("time_display").checked = false;
                    $("story_line").checked = false;

                    // 制作与支持信息
                    g_hideSupportInfo = 0;
                    $("P_D_HIDE_SUPPORT").innerHTML = "";
                    $("hide_support_info").checked = false;
                    $("SUPPORT_INFO").style.display = "";    // 不能用block，否则会换行

                    // 概述
                    g_genWords = "[概述]全息脑图是按照大系统观原理开发的新型思维工具，用于升维思考。让您以系统的观点看待世界，专注系统的结构信息——全息，抓住事物的本质，透过表象和数据发现规律。世间每项事物都是一个系统，其核心叫做吸引子@，内部存在几个序参量，它们决定着系统的属性和行为，外部存在若干关联参量。";
                    processGenWords();

                    // 作者
                    g_authorDate = AHMM_AUTHOR;
                    $("AUTHOR_DATE").innerHTML = g_authorDate;

                    // 左标签
                    g_inMark = "内部序参量";
                    $("IN_MARK").innerHTML = g_inMark;

                    // 右标签
                    g_outMark = "外部关联参量";
                    $("OUT_MARK").innerHTML = g_outMark;

                    // 颜色系列号
                    g_colorSetNo = 43;
                    for (g_iBlock = 0; g_iBlock < g_oParaID.length; g_iBlock++) {
                        g_blockColor[g_iBlock] = g_bubbleColor[g_colorSetNo][g_iBlock * 2 + 1]; // 借用圆泡泡bubble颜色
                    }

                    // 颜色透明度
                    g_colorOpacityNo = 3;

                    // 文本颜色
                    g_textColorNo = 0;

                    // 边线颜色
                    g_borderColorNo = 2;

                    // 边线线型
                    g_borderWidthNo = 0;

                    // 背景颜色
                    g_backgroundColorNo = 6;

                    // 各个圆泡泡bubble的参数
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {
                        g_bubbleX[g_iBubble] = BubbleX[g_iBubble];
                        g_bubbleY[g_iBubble] = BubbleY[g_iBubble];
                    }   // for g_iBubble

                    g_bubbleText0 = BubbleText0Example;
                    g_bubbleText1 = BubbleText1Example;
                    g_bubbleText2 = BubbleText2Example;
                    g_bubbleText3 = BubbleText3Example;
                    g_bubbleText4 = BubbleText4Example;
                    g_bubbleLink = BubbleLinkExample;
                    g_bubblePic = BubblePicExample;
                    g_bubbleScale = BubbleScaleExample;

                    // 读取各个外部关联参量长方块block的参数
                    g_blockText0 = BlockText0Example;
                    g_blockText1 = BlockText1Example;
                    g_blockText2 = BlockText2Example;
                    g_blockText3 = BlockText3Example;
                    g_blockLink = BlockLinkExample;
                    g_blockPic = BlockPicExample;

                    showAllBubblesMust();

                }


                // ********************************************************** setDataForNewAHMM ********************************************************
                // 为创建新“全息脑图”设置参数
                function setDataForNewAHMM() {

                    var BubbleText0NewAHMM = ["@", "[1]", "[2]", "[3]", "[4]", "[5]", "[6]", "[7]", "[8]", "[9]", "[10]", "[11]"];
                    var BubbleText1NewAHMM = ["+吸引子", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词", "+主题词"];
                    var BubbleText2NewAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText3NewAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText4NewAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleLinkNewAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubblePicNewAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleScaleNewAHMM = ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1"];
                    var BlockText0NewAHMM = ["空置未用", "[1]", "[2]", "[3]", "[4]", "[5]"];
                    var BlockText1NewAHMM = ["+关联词", "+关联词", "+关联词", "+关联词", "+关联词", "+关联词"];
                    var BlockText2NewAHMM = ["", "", "", "", "", ""];
                    var BlockText3NewAHMM = ["", "", "", "", "", ""];
                    var BlockLinkNewAHMM = ["", "", "", "", "", ""];
                    var BlockPicNewAHMM = ["", "", "", "", "", ""];
                    var BubbleX = [0.45, 0.246, 0.668, 0.835, 0.690, 0.886, 0.142, 0.06, 0.272, 0.433, 0.579, 0.793];
                    var BubbleY = [0.3, 0.406, 0.432, 0.449, 0.151, 0.235, 0.175, 0.50, 0.156, 0.543, 0.043, 0.107];

                    var tDataId;

                    // 数据是否保存过
                    g_bubblesFixedOrRandom = "0";

                    // Logo数据
                    g_logoPic = "";
                    $("logo_pic").value = g_logoPic;

                    // 背景图片数据
                    g_backPic = "";
                    $("back_pic").value = g_backPic;

                    // 背景音乐数据
                    g_backMusic = "";
                    $("back_music").value = g_backMusic;

                    // 全息脑图标题、链接页数据
                    g_mapTitle = "+全息脑图标题";
                    g_prevPage = "";
                    g_nextPage = "";
                    g_homePage = "";
                    g_faceCover = "";
                    g_backCover = "";
                    g_sequentialPlay = "";
                    g_showTimeWhenPlay = "";
                    g_storyLine = "";
                    $("MAP_TITLE").innerHTML = g_mapTitle;
                    $("map_title").value = "";
                    $("prev_page").value = g_prevPage;
                    $("next_page").value = g_nextPage;
                    $("home_page").value = g_homePage;
                    $("face_cover").value = g_faceCover;
                    $("back_cover").value = g_backCover;
                    $("sequential_play").checked = false;
                    $("time_display").checked = false;
                    $("story_line").checked = false;

                    // 制作与支持信息
                    g_hideSupportInfo = 0;
                    $("P_D_HIDE_SUPPORT").innerHTML = "";
                    $("hide_support_info").checked = false;
                    $("SUPPORT_INFO").style.display = "";    // 不能用block，否则会换行

                    // 概述
                    g_genWords = "[+概述]<span style='color: #AA0000; font-family: 楷体; font-size: 40px; font-weight: bold;'>全息脑图</span>是按照大系统思维原理制作的新型思维导图。让您以系统的观点看世界，专注系统的结构信息——全息，抓住事物的本质，透过表象和数据发现规律。单击各个【...】编辑脑图，【≚】排版配色，&lt;<span style='color: #AA0000;'>Ctrl+S</span>&gt;键（苹果电脑为Command+S）或浏览器菜单【保存/下载】永久保存。";
                    // $("GEN_WORDS_TEXT").innerHTML = g_genWords;
                    processGenWords();

                    // 作者
                    g_authorDate = AHMM_AUTHOR;
                    $("AUTHOR_DATE").innerHTML = g_authorDate;

                    // 左标签
                    g_inMark = "内部序参量";
                    $("IN_MARK").innerHTML = g_inMark;

                    // 右标签
                    g_outMark = "外部关联参量";
                    $("OUT_MARK").innerHTML = g_outMark;

                    // 颜色系列号
                    g_colorSetNo = 0;
                    for (g_iBlock = 0; g_iBlock < g_oParaID.length; g_iBlock++) {
                        g_blockColor[g_iBlock] = g_bubbleColor[g_colorSetNo][g_iBlock * 2 + 1]; // 借用圆泡泡bubble颜色
                    }

                    // 颜色透明度
                    g_colorOpacityNo = 0;

                    // 文本颜色
                    g_textColorNo = 0;

                    // 边线颜色
                    g_borderColorNo = 0;

                    // 边线线型
                    g_borderWidthNo = 0;

                    // 背景颜色
                    g_backgroundColorNo = 0;

                    // 各个圆泡泡bubble的参数
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {
                        g_bubbleX[g_iBubble] = BubbleX[g_iBubble];
                        g_bubbleY[g_iBubble] = BubbleY[g_iBubble];
                    }   // for g_iBubble

                    g_bubbleText0 = BubbleText0NewAHMM;
                    g_bubbleText1 = BubbleText1NewAHMM;
                    g_bubbleText2 = BubbleText2NewAHMM;
                    g_bubbleText3 = BubbleText3NewAHMM;
                    g_bubbleText4 = BubbleText4NewAHMM;
                    g_bubbleLink = BubbleLinkNewAHMM;
                    g_bubblePic = BubblePicNewAHMM;
                    g_bubbleScale = BubbleScaleNewAHMM;

                    // 读取各个外部关联参量长方块block的参数
                    g_blockText0 = BlockText0NewAHMM;
                    g_blockText1 = BlockText1NewAHMM;
                    g_blockText2 = BlockText2NewAHMM;
                    g_blockText3 = BlockText3NewAHMM;
                    g_blockLink = BlockLinkNewAHMM;
                    g_blockPic = BlockPicNewAHMM;

                    // 设置基因信息
                    if (getUrlParam("func") == "2") {
                        let tStrGene = "";
                        // 设置新脑图的ID，模仿UUID生成唯一码
                        $("P_D_SELF_ID").innerHTML = generateUUIDLikeID();
                        // 设置新脑图的代次，等于父图代次+1
                        tStrGene = getUrlParam("fgene");  // 从URL获得父图的代次
                        $("P_D_SELF_GENERATION").innerHTML = (myString2IntNumber(tStrGene) + 1) + "";
                        // 设置新脑图的创建时间为当前时间
                        $("P_D_SELF_CREATION_TIME").innerHTML = getFormattedDateTime();
                        // 设置新脑图的最后更新时间为当前时间
                        $("P_D_SELF_LAST_TIME").innerHTML = getFormattedDateTime();
                        // 设置创建新脑图的AHMM的版本为当前AHMM版本
                        $("P_D_SELF_CREATION_VERSION").innerHTML = AHMM_VERSION;
                        // 设置创建新脑图的父脑图的ID
                        tStrGene = getUrlParam("fid");  // 从URL获得父图ID
                        $("P_D_FATHER_ID").innerHTML = tStrGene;
                        // 设置父脑图的名称
                        tStrGene = getUrlParam("ftitle");  // 从URL获得父图名称
                        $("P_D_FATHER_TITLE").innerHTML = tStrGene;
                        // 设置父脑图的版权信息
                        tStrGene = getUrlParam("finfo");  // 从URL获得父图信息
                        $("P_D_FATHER_INFO").innerHTML = tStrGene;
                    }

                    saveAllData();
                    showAllBubblesMust();

                }


                // ********************************************************** setDataForAIAHMM *********************************************************
                // 用服务器端 llmcaller.html 调用 AI，用 sessionStorage 传来 JSON，为“全息脑图”设置参数
                function setDataForAIAHMM() {

                    var BubbleText0AIAHMM = ["@", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText1AIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText2AIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText3AIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText4AIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleLinkAIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubblePicAIAHMM = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleScaleAIAHMM = ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1", "1"];
                    var BlockText0AIAHMM = ["空置未用", "", "", "", "", ""];
                    var BlockText1AIAHMM = ["", "", "", "", "", ""];
                    var BlockText2AIAHMM = ["", "", "", "", "", ""];
                    var BlockText3AIAHMM = ["", "", "", "", "", ""];
                    var BlockLinkAIAHMM = ["", "", "", "", "", ""];
                    var BlockPicAIAHMM = ["", "", "", "", "", ""];
                    var BubbleX = [0.45, 0.246, 0.668, 0.835, 0.690, 0.886, 0.142, 0.06, 0.272, 0.433, 0.579, 0.793];
                    var BubbleY = [0.3, 0.406, 0.432, 0.449, 0.151, 0.235, 0.175, 0.50, 0.156, 0.543, 0.043, 0.107];

                    // 从 sessionStorage 获取 AI 传过来的 全息脑图参数。服务器端 llmcaller.html 保存了。
                    // 从 sessionStorage 获取 ahmm_web_url 参数
                    let webUrlDataStr = sessionStorage.getItem("ahmm_web_url"); // 从 sessionStorage 获取 ahmm_web_url 参数，不必使用 localStorage

                    // 从 sessionStorage 获取 ahmm_json 参数
                    let jsonDataStr = sessionStorage.getItem("ahmm_json");   // 从 sessionStorage 获取 ahmm_json 参数，不必使用 localStorage
                    
                    let decodedJson = "";   // 解码后的 JSON 字符串
                    let jsonObject = "";    // 解析后的 JSON 对象,取数据要基于它操作

                    // 解码、解析 JSON 字符串
                    if (jsonDataStr) {
                        try {
                            decodedJson = decodeURIComponent(jsonDataStr);
                            jsonObject = JSON.parse(decodedJson);
                            console.log(JSON.stringify(jsonObject, null, 4));
                        } catch (e) {
                            alert('解析 JSON 出错: ' + e.message) + "\n请重新生成脑图。";
                        }
                    } else {
                        alert('未能获取服务器传来的 JSON 参数。\n请重新生成脑图。');
                    }

                    // 设置各个圆泡泡bubble的各行的文本，不包括吸引子，所以从 1 开始
                    for (g_iBubble = 1; g_iBubble <= jsonObject.in_blocks.length; g_iBubble++) {

                        if (jsonObject.in_blocks[g_iBubble-1].in_block_name == undefined) {
                            BubbleText0AIAHMM[g_iBubble] = "";
                        } else {
                            BubbleText0AIAHMM[g_iBubble] = jsonObject.in_blocks[g_iBubble-1].in_block_name;
                        }
                        console.log(BubbleText0AIAHMM[g_iBubble]);

                        if (jsonObject.in_blocks[g_iBubble-1].in_block_kernal_word == undefined) {
                            BubbleText1AIAHMM[g_iBubble] = "";
                        } else {
                            BubbleText1AIAHMM[g_iBubble] = jsonObject.in_blocks[g_iBubble-1].in_block_kernal_word;
                        }

                        if (jsonObject.in_blocks[g_iBubble-1].in_block_keywords == undefined) {
                            BubbleText2AIAHMM[g_iBubble] = "";
                        } else {
                            BubbleText2AIAHMM[g_iBubble] = jsonObject.in_blocks[g_iBubble-1].in_block_keywords;
                        }

                        if (jsonObject.in_blocks[g_iBubble-1].in_block_info == undefined) {
                            BubbleText3AIAHMM[g_iBubble] = "";
                        } else {
                            BubbleText3AIAHMM[g_iBubble] = jsonObject.in_blocks[g_iBubble-1].in_block_info;
                        }

                        if (jsonObject.in_blocks[g_iBubble-1].in_block_more_info == undefined) {
                            BubbleText4AIAHMM[g_iBubble] = "";
                        } else {
                            BubbleText4AIAHMM[g_iBubble] = jsonObject.in_blocks[g_iBubble-1].in_block_more_info;
                        }

                        let s;
                        if (jsonObject.in_blocks[g_iBubble-1].in_block_importance == undefined) {
                            BubbleScaleAIAHMM[g_iBubble] = "1"; 
                        } else {
                            // 依据重要性设置泡泡大小
                            s = (0.1 * g_iBubble + 0.9) * parseFloat(jsonObject.in_blocks[g_iBubble-1].in_block_importance) / 10 + "";
                            BubbleScaleAIAHMM[g_iBubble] = s; //jsonObject.in_blocks[g_iBubble-1].in_block_importance;
                        }
                    }   // for g_iBubble

                    // 设置吸引子泡泡的文本。需要单独设置
                    // BubbleText0AIAHMM[0] = "@" ,不设置
                    if (jsonObject.summary_block.summary_block_kernal_word == undefined) {
                        BubbleText1AIAHMM[0] = "";
                    } else {
                        BubbleText1AIAHMM[0] = jsonObject.summary_block.summary_block_kernal_word;
                    }

                    if (jsonObject.summary_block.summary_block_keywords == undefined) {
                        BubbleText2AIAHMM[0] = "";
                    } else {
                        BubbleText2AIAHMM[0] = jsonObject.summary_block.summary_block_keywords;
                    }

                    if (jsonObject.summary_block.summary_block_info == undefined) {
                        BubbleText3AIAHMM[0] = "";
                    } else {
                        BubbleText3AIAHMM[0] = jsonObject.summary_block.summary_block_info;
                    }

                    if (jsonObject.summary_block.summary_block_more_info == undefined) {
                        BubbleText4AIAHMM[0] = "";
                    } else {
                        BubbleText4AIAHMM[0] = jsonObject.summary_block.summary_block_more_info;
                    }
                    // 将网页地址连接到吸引子泡泡
                    BubbleLinkAIAHMM[0] =  webUrlDataStr; // 连接到网页地址

                    // 设置各个块块block的各行的文本
                    for (g_iBlock = 1; g_iBlock <= jsonObject.out_blocks.length; g_iBlock++) {

                        if (jsonObject.out_blocks[g_iBlock-1].out_block_name == undefined) {
                            BlockText0AIAHMM[g_iBlock] = "";
                        } else {
                            BlockText0AIAHMM[g_iBlock] = jsonObject.out_blocks[g_iBlock-1].out_block_name;
                        }

                        if (jsonObject.out_blocks[g_iBlock-1].out_block_kernal_word == undefined) {
                            BlockText1AIAHMM[g_iBlock] = "";
                        } else {
                            BlockText1AIAHMM[g_iBlock] = jsonObject.out_blocks[g_iBlock-1].out_block_kernal_word;
                        }

                        if (jsonObject.out_blocks[g_iBlock-1].out_block_keywords == undefined) {
                            BlockText2AIAHMM[g_iBlock] = "";
                        } else {
                            BlockText2AIAHMM[g_iBlock] = jsonObject.out_blocks[g_iBlock-1].out_block_keywords;
                        }

                        if (jsonObject.out_blocks[g_iBlock-1].out_block_info == undefined) {
                            BlockText3AIAHMM[g_iBlock] = "";
                        } else {
                            BlockText3AIAHMM[g_iBlock] = jsonObject.out_blocks[g_iBlock-1].out_block_info;
                        }

                    }   // for g_iBlock

                    // 数据是否保存过。应设为1。不设为1则不显示传来数据
                    g_bubblesFixedOrRandom = "1";

                    // Logo数据
                    g_logoPic = "";
                    $("logo_pic").value = g_logoPic;

                    // 背景图片数据
                    g_backPic = "";
                    $("back_pic").value = g_backPic;

                    // 背景音乐数据
                    g_backMusic = "";
                    $("back_music").value = g_backMusic;

                    // 全息脑图标题、链接页数据
                    g_mapTitle = jsonObject.title; // 从 JSON 中获取标题
                    g_prevPage = "";
                    g_nextPage = "";
                    g_homePage = "";
                    g_faceCover = "";
                    g_backCover = "";
                    g_sequentialPlay = "";
                    g_showTimeWhenPlay = "";
                    g_storyLine = "";
                    $("MAP_TITLE").innerHTML = g_mapTitle;
                    $("map_title").value = "";
                    $("prev_page").value = g_prevPage;
                    $("next_page").value = g_nextPage;
                    $("home_page").value = g_homePage;
                    $("face_cover").value = g_faceCover;
                    $("back_cover").value = g_backCover;
                    $("sequential_play").checked = false;
                    $("time_display").checked = false;
                    $("story_line").checked = false;

                    // 制作与支持信息
                    g_hideSupportInfo = 0;
                    $("P_D_HIDE_SUPPORT").innerHTML = "";
                    $("hide_support_info").checked = false;
                    $("SUPPORT_INFO").style.display = "";    // 不能用block，否则会换行

                    // 概述
                    g_genWords = "[概述]" + jsonObject.intro; // 从 JSON 中获取概述
                    processGenWords();

                    // 作者
                    g_authorDate = "本图由【大系统观开放论坛】AI 自动生成 &nbsp;&nbsp;&nbsp;" + getCurrentDateFormatted();
                    $("AUTHOR_DATE").innerHTML = g_authorDate;

                    // 左标签
                    g_inMark = "内部序参量";
                    $("IN_MARK").innerHTML = g_inMark;

                    // 右标签
                    g_outMark = "外部关联参量";
                    $("OUT_MARK").innerHTML = g_outMark;

                    // 颜色系列号，取彩色
                    g_colorSetNo = 43;
                    for (g_iBlock = 0; g_iBlock < g_oParaID.length; g_iBlock++) {
                        g_blockColor[g_iBlock] = g_bubbleColor[g_colorSetNo][g_iBlock * 2 + 1]; // 借用圆泡泡bubble颜色
                    }

                    // 颜色透明度，高度透明
                    g_colorOpacityNo = 5;

                    // 文本颜色
                    g_textColorNo = 0;

                    // 边线颜色
                    g_borderColorNo = 2;

                    // 边线线型
                    g_borderWidthNo = 0;

                    // 背景颜色
                    g_backgroundColorNo = 0;

                    // 各个圆泡泡bubble的参数
                    // 设置各个圆泡泡bubble的X、Y坐标
                    for (g_iBubble = 0; g_iBubble < g_iParaID.length; g_iBubble++) {
                        g_bubbleX[g_iBubble] = BubbleX[g_iBubble];
                        g_bubbleY[g_iBubble] = BubbleY[g_iBubble];
                    }   // for g_iBubble

                    // 设置各个圆泡泡bubble的文字
                    g_bubbleText0 = BubbleText0AIAHMM;
                    g_bubbleText1 = BubbleText1AIAHMM;
                    g_bubbleText2 = BubbleText2AIAHMM;
                    g_bubbleText3 = BubbleText3AIAHMM;
                    g_bubbleText4 = BubbleText4AIAHMM;
                    g_bubbleLink = BubbleLinkAIAHMM;
                    g_bubblePic = BubblePicAIAHMM;
                    g_bubbleScale = BubbleScaleAIAHMM;

                    // 读取各个外部关联参量长方块block的参数
                    g_blockText0 = BlockText0AIAHMM;
                    g_blockText1 = BlockText1AIAHMM;
                    g_blockText2 = BlockText2AIAHMM;
                    g_blockText3 = BlockText3AIAHMM;
                    g_blockLink = BlockLinkAIAHMM;
                    g_blockPic = BlockPicAIAHMM;

                    // 设置基因信息
                    if (getUrlParam("func") == "2") {
                        let tStrGene = "";
                        // 设置新脑图的ID，模仿UUID生成唯一码
                        $("P_D_SELF_ID").innerHTML = generateUUIDLikeID();
                        // 设置新脑图的代次，等于父图代次+1
                        tStrGene = getUrlParam("fgene");  // 从URL获得父图的代次
                        $("P_D_SELF_GENERATION").innerHTML = (myString2IntNumber(tStrGene) + 1) + "";
                        // 设置新脑图的创建时间为当前时间
                        $("P_D_SELF_CREATION_TIME").innerHTML = getFormattedDateTime();
                        // 设置新脑图的最后更新时间为当前时间
                        $("P_D_SELF_LAST_TIME").innerHTML = getFormattedDateTime();
                        // 设置创建新脑图的AHMM的版本为当前AHMM版本
                        $("P_D_SELF_CREATION_VERSION").innerHTML = AHMM_VERSION;
                        // 设置创建新脑图的父脑图的ID
                        tStrGene = getUrlParam("fid");  // 从URL获得父图ID
                        $("P_D_FATHER_ID").innerHTML = tStrGene;
                        // 设置父脑图的名称
                        tStrGene = getUrlParam("ftitle");  // 从URL获得父图名称
                        $("P_D_FATHER_TITLE").innerHTML = tStrGene;
                        // 设置父脑图的版权信息
                        tStrGene = getUrlParam("finfo");  // 从URL获得父图信息
                        $("P_D_FATHER_INFO").innerHTML = tStrGene;
                    }

                    saveAllData();
                    showAllBubblesMust();

                }


                // ******************************************************** setDataForNewAHMMCopy ******************************************************
                // 复制当前脑图，创建新“全息脑图”，并设置基因参数
                // 只能复制已经保存到磁盘的文件，未保存到磁盘的中间数据不能复制
                function setDataForNewAHMMCopy() {

                    // 用当前脑图的数据填到新建的脑图中，使用原 setAllBySavedData() 即可。
                    setAllBySavedData();

                    // 如果从示例数据复制新建脑图，则先设置为示例的数据。
                    // 从URL获得参数 exm，当 exm=1 时，表示是从示例界面复制脑图。
                    // 此时，把新脑图的数据设置为示例的数据。
                    // 否则，复制数据存储区的数据
                    if (getUrlParam("exm") == "1") {  
                        setDataForExample();
                    }

                    // 设置基因信息
                    if (getUrlParam("func") == "6") {

                        let tStrGene = "";
                        // 设置新脑图的ID，模仿UUID生成唯一码
                        $("P_D_SELF_ID").innerHTML = generateUUIDLikeID();
                        // 设置新脑图的代次，等于父图代次+1
                        tStrGene = getUrlParam("fgene");  // 从URL获得父图的代次
                        $("P_D_SELF_GENERATION").innerHTML = (myString2IntNumber(tStrGene) + 1) + "";
                        // 设置新脑图的创建时间为当前时间
                        $("P_D_SELF_CREATION_TIME").innerHTML = getFormattedDateTime();
                        // 设置新脑图的最后更新时间为当前时间
                        $("P_D_SELF_LAST_TIME").innerHTML = getFormattedDateTime();
                        // 设置创建新脑图的AHMM的版本为当前AHMM版本
                        $("P_D_SELF_CREATION_VERSION").innerHTML = AHMM_VERSION;
                        // 设置创建新脑图的父脑图的ID
                        tStrGene = getUrlParam("fid");  // 从URL获得父图ID
                        $("P_D_FATHER_ID").innerHTML = tStrGene;
                        // 设置父脑图的名称
                        tStrGene = getUrlParam("ftitle");  // 从URL获得父图名称
                        $("P_D_FATHER_TITLE").innerHTML = tStrGene;
                        // 设置父脑图的版权信息
                        tStrGene = getUrlParam("finfo");  // 从URL获得父图信息
                        $("P_D_FATHER_INFO").innerHTML = tStrGene;
                    }

                    // 更改并保存副本标题，副本标题为：原标题-副本-本图ID后4位。
                    // 为了区分不同的副本，每个副本基因是不同的。
                    // 因为复制时只能复制已保存到磁盘文件中的脑图，中间结果未存盘，不能复制过去，
                    // 这是因为，新建脑图是在浏览器中重新打开本文件，只是携带了 func=* 这个参数，
                    // 因此，没存盘的原始文件的中间数据无法使用。 
                    g_mapTitle += "-副本" + $("P_D_SELF_ID").innerHTML.slice(-4);
                    $("map_title").value = g_mapTitle;
                    $("P_D_TITLE").innerHTML = g_mapTitle;
                    $("MAP_TITLE").innerHTML = $("map_title").value;

                    // 从上次保存后文件是否修改过，用于退出时提醒确认。
                    // 设为 0，这样会在关闭浏览器时提示保存。
                    g_fileModified = 0;

                    // 下面设置新建信息、未保存状态，这样就会提示【操作向导】。
                    // Bubbles是否保存过，即已存在，如果没存过，则表示为新建
                    // 设为新建，即 =0； 这样会弹出【操作向导】窗口，提示操作方法
                    // 写入本脑图数据区
                    tDataId = "P_D_SAVED";
                    $(tDataId).innerHTML = "0";       // 程序运行中，g_bubblesFixedOrRandom存储该值

                    // 上述 g_bubblesFixedOrRandom 变量用于表示星形模式时泡泡是随机的还是固定的。
                    // 此处设置为 0 ，否则不显示【操作向导】
                    g_bubblesFixedOrRandom = "0";

                    // 将原脑图数据保存到新脑图的数据区，但并未保存到磁盘文件中。
                    // 复制脑图时，从已存盘的文件中读取原脑图数据，再填到新建的脑图，
                    // 所以未保存的中间成果不能复制到新脑图。
                    saveAllData();

                    // 强制显示所有泡泡，因为原脑图可能有隐藏。
                    // 强制显示避免其他可能考虑不到的问题。
                    showAllBubblesMust();

                }


                // *********************************************************  处理点击修改内容  **************************************************************
                // *********************************************************** editInnerPara ***********************************************************
                // 单击圆泡泡bubble时显示编辑窗口
                function editInnerPara(no) {  // 从内存读取，放到文本框

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    if (g_inDrag == 0)  // 拖动时不编辑
                    {
                        var t;
                        g_tmpBubbleClicked = 1;   // 鼠标悬浮移走后保持标记
                        g_currentBubbleID = no;   // 保存刚被点击的圆泡泡bubble序号
                        $("EDIT_INNER_PARA_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                        $("EDIT_INNER_PARA_BOX").style.zIndex = g_zIndexBox++;
                        $("inner_core_words").focus();

                        // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                        t = 400 + (Math.random() * 60 - 30);
                        $("EDIT_INNER_PARA_BOX").style.left = t + "px";

                        readAllData(); // 从数据区读取所有数据，放入内存

                        var tID;

                        $("CURRENT_INNER_ORDER_NO").innerHTML = no == 0 ? "@" : no;
                        if (g_currentBubbleID == 0)   // 如果是吸引子
                        {
                            $("CURRENT_INNER_ORDER_TYPE").innerHTML = "系统吸引子@";
                            $("ADJUST_INNER_ORDER_TEXT").style.display = "none";  // 隐藏
                            $("NOW_WORKS").style.display = "none";
                            $("dec_inner_order_no").style.display = "none";
                            $("inc_inner_order_no").style.display = "none";
                            $("inner_hide").disabled = "disabled";
                        }
                        else {
                            $("CURRENT_INNER_ORDER_TYPE").innerHTML = "内部序参量";
                            $("ADJUST_INNER_ORDER_TEXT").style.display = "block";   // 显示
                            $("NOW_WORKS").style.display = "block";
                            $("dec_inner_order_no").style.display = "block";
                            $("inc_inner_order_no").style.display = "block";
                            $("inner_hide").disabled = "";
                        }
                        $("inner_tag_words").value = g_bubbleText0[no].replace("(hide)", "");
                        $("inner_core_words").value = (g_bubbleText1[no] == "+吸引子" || g_bubbleText1[no] == "+主题词") ? "" : g_bubbleText1[no];
                        $("inner_key_words").value = g_bubbleText2[no];
                        $("inner_main_words").value = g_bubbleText3[no];
                        $("inner_plain_words").value = g_bubbleText4[no];

                        var lu = g_bubbleLink[no].trim();

                        var sameWin = lu.indexOf("(sw)", 0);     // 标记(sw) 表示“在父窗口(当前标签页)打开”，缺省或链接为空时在新的新标签页打开
                        if (sameWin == -1)  // 如果不在父窗口(当前标签页)，即在新标签页
                        {
                            $("inner_add_url_sw").checked = true;
                        }
                        else {
                            $("inner_add_url_sw").checked = false;
                        }

                        var autoFit = lu.indexOf("(af)", 0);     // 标记(af) 表示“图片尺寸自动适应”，缺省或链接为空时“保持原图尺寸”
                        if (autoFit == -1)  // 如果不自动适应，即保持原图尺寸
                        {
                            $("inner_add_url_af").checked = true;
                        }
                        else {
                            $("inner_add_url_af").checked = false;
                        }

                        if (lu == "") {
                            $("inner_add_url_sw").checked = false;
                            $("inner_add_url_af").checked = false;
                        }

                        $("inner_add_url").value = (lu.replace("(sw)", "")).replace("(af)", "");

                        $("inner_back_pic").value = g_bubblePic[no];

                        $("inner_scale").value = g_bubbleScale[no];

                        setAllBySavedData();    // 按照已保存的数据绘制全部

                    }// if

                } // function 结束


                // ********************************************************** changeInnerPara **********************************************************
                // 更新修改一个圆泡泡bubble的显示信息，同时保存文件全部数据
                function changeInnerPara() {   // 全局变量 g_currentBubbleID

                    $("EDIT_INNER_PARA_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT, strT2;

                    tID = "I_P" + g_currentBubbleID + "_T0";
                    $(tID).innerHTML = $("inner_tag_words").value;
                    g_bubbleText0[g_currentBubbleID] = $("inner_tag_words").value;

                    tID = "I_P" + g_currentBubbleID + "_T1_1";
                    $(tID).innerHTML = $("inner_core_words").value;
                    tID = "I_P" + g_currentBubbleID + "_T1_2";
                    $(tID).innerHTML = $("inner_core_words").value;
                    g_bubbleText1[g_currentBubbleID] = $("inner_core_words").value;

                    tID = "I_P" + g_currentBubbleID + "_T2";
                    $(tID).innerHTML = $("inner_key_words").value;
                    g_bubbleText2[g_currentBubbleID] = $("inner_key_words").value;

                    tID = "I_P" + g_currentBubbleID + "_T3";
                    $(tID).innerHTML = $("inner_main_words").value;
                    g_bubbleText3[g_currentBubbleID] = $("inner_main_words").value;

                    tID = "I_P" + g_currentBubbleID + "_T4";
                    $(tID).innerHTML = $("inner_plain_words").value;
                    g_bubbleText4[g_currentBubbleID] = $("inner_plain_words").value;

                    // tID = "I_P" + g_currentBubbleID + "_T5";
                    strT = $("inner_add_url").value.trim();
                    strT2 = "";

                    // 标记(sw)， 表示same window ,“在父窗口(当前标签页)打开”，缺省或链接为空时在“新标签页打开”
                    if ($("inner_add_url_sw").checked == false && strT != "") { strT2 = "(sw)"; }
                    // 标记(af) 表示auto fit, “尺寸自动适应”，缺省或链接为空时表示“保持原图尺寸”，但不允许超出内嵌窗口。仅限图片，html等无效
                    if ($("inner_add_url_af").checked == false && strT != "") { strT2 += "(af)"; }

                    g_bubbleLink[g_currentBubbleID] = strT2 + strT.trim();

                    // 图片
                    strT = $("inner_back_pic").value.trim();
                    g_bubblePic[g_currentBubbleID] = strT;

                    // 缩放比例
                    let num = parseFloat($("inner_scale").value);
                    if (isNaN(num)) { num = 1.0; }
                    if (num < 0) { num = 0; }
                    if (num > 3) { num = 3.0; }
                    g_bubbleScale[g_currentBubbleID] = num + "";

                    saveAllData(); // 保存全部数据到数据区

                    setAllBySavedData();

                    g_tmpBubbleClicked = 0;   // 鼠标悬浮高亮恢复

                }


                // *********************************************************** clearInnerPara **********************************************************
                // 清除一个圆泡泡bubble的显示窗口的信息
                function clearInnerPara() {   // 全局变量 g_currentBubbleID

                    $("inner_tag_words").value = "";
                    $("inner_core_words").value = "";
                    $("inner_key_words").value = "";
                    $("inner_main_words").value = "";
                    $("inner_plain_words").value = "";
                    $("inner_add_url").value = "";
                    $("inner_add_url_sw").checked = false;
                    $("inner_add_url_af").checked = false;
                    $("inner_back_pic").value = "";
                    $("inner_scale").value = "1";

                }


                // ************************************************************ hideInnerPara **********************************************************
                // 隐藏一个圆泡泡bubble。根据(hide)标记
                function hideInnerPara() {   // 全局变量 g_currentBubbleID

                    $("EDIT_INNER_PARA_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT, strT2;

                    tID = "DIV_IN_" + g_currentBubbleID;
                    $(tID).style.display = "none";
                    tID2 = "LN" + g_currentBubbleID;
                    // $(tID2).style.strokeWidth = "0";
                    $(tID2).style.display = "block";

                    strT = $("inner_tag_words").value;
                    strT2 = "";
                    // 标记(hide) 表示“隐藏该bubble”，缺省或为空时不隐藏
                    if (g_bubbleText0[g_currentBubbleID].indexOf("(hide)") == -1) { strT2 = "(hide)"; }
                    g_bubbleText0[g_currentBubbleID] = strT2 + strT.trim();

                    saveAllData(); // 保存全部数据到数据区

                    setAllBySavedData();

                    g_tmpBubbleClicked = 0;   // 鼠标悬浮高亮恢复

                }


                // ********************************************************* decreaseInnerOrderNo ******************************************************
                // 降低一个圆泡泡bubble的排序
                function decreaseInnerOrderNo() {   // 全局变量 g_currentBubbleID

                    var strT;
                    if (g_currentBubbleID > 1) {
                        strT = g_bubbleText0[g_currentBubbleID];
                        g_bubbleText0[g_currentBubbleID] = g_bubbleText0[g_currentBubbleID - 1];
                        g_bubbleText0[g_currentBubbleID - 1] = strT;

                        strT = g_bubbleText1[g_currentBubbleID];
                        g_bubbleText1[g_currentBubbleID] = g_bubbleText1[g_currentBubbleID - 1];
                        g_bubbleText1[g_currentBubbleID - 1] = strT;

                        strT = g_bubbleText2[g_currentBubbleID];
                        g_bubbleText2[g_currentBubbleID] = g_bubbleText2[g_currentBubbleID - 1];
                        g_bubbleText2[g_currentBubbleID - 1] = strT;

                        strT = g_bubbleText3[g_currentBubbleID];
                        g_bubbleText3[g_currentBubbleID] = g_bubbleText3[g_currentBubbleID - 1];
                        g_bubbleText3[g_currentBubbleID - 1] = strT;

                        strT = g_bubbleText4[g_currentBubbleID];
                        g_bubbleText4[g_currentBubbleID] = g_bubbleText4[g_currentBubbleID - 1];
                        g_bubbleText4[g_currentBubbleID - 1] = strT;

                        strT = g_bubbleLink[g_currentBubbleID];
                        g_bubbleLink[g_currentBubbleID] = g_bubbleLink[g_currentBubbleID - 1];
                        g_bubbleLink[g_currentBubbleID - 1] = strT;

                        strT = g_bubblePic[g_currentBubbleID];
                        g_bubblePic[g_currentBubbleID] = g_bubblePic[g_currentBubbleID - 1];
                        g_bubblePic[g_currentBubbleID - 1] = strT;

                        // 缩放比例不调整

                        g_currentBubbleID--;
                        $("CURRENT_INNER_ORDER_NO").innerHTML = (g_currentBubbleID) + "";

                        g_bubblesFixedOrRandom = "1";
                        saveAllData();
                        setAllBySavedData();    // 按照已保存的数据绘制全部

                    }

                }


                // ********************************************************* increaseInnerOrderNo ******************************************************
                // 提升一个圆泡泡bubble的排序
                function increaseInnerOrderNo() {   // 全局变量 g_currentBubbleID

                    var strT;
                    if (g_currentBubbleID < (g_iParaID.length - 1)) {
                        strT = g_bubbleText0[g_currentBubbleID];
                        g_bubbleText0[g_currentBubbleID] = g_bubbleText0[g_currentBubbleID + 1];
                        g_bubbleText0[g_currentBubbleID + 1] = strT;

                        strT = g_bubbleText1[g_currentBubbleID];
                        g_bubbleText1[g_currentBubbleID] = g_bubbleText1[g_currentBubbleID + 1];
                        g_bubbleText1[g_currentBubbleID + 1] = strT;

                        strT = g_bubbleText2[g_currentBubbleID];
                        g_bubbleText2[g_currentBubbleID] = g_bubbleText2[g_currentBubbleID + 1];
                        g_bubbleText2[g_currentBubbleID + 1] = strT;

                        strT = g_bubbleText3[g_currentBubbleID];
                        g_bubbleText3[g_currentBubbleID] = g_bubbleText3[g_currentBubbleID + 1];
                        g_bubbleText3[g_currentBubbleID + 1] = strT;

                        strT = g_bubbleText4[g_currentBubbleID];
                        g_bubbleText4[g_currentBubbleID] = g_bubbleText4[g_currentBubbleID + 1];
                        g_bubbleText4[g_currentBubbleID + 1] = strT;

                        strT = g_bubbleLink[g_currentBubbleID];
                        g_bubbleLink[g_currentBubbleID] = g_bubbleLink[g_currentBubbleID + 1];
                        g_bubbleLink[g_currentBubbleID + 1] = strT;

                        strT = g_bubblePic[g_currentBubbleID];
                        g_bubblePic[g_currentBubbleID] = g_bubblePic[g_currentBubbleID + 1];
                        g_bubblePic[g_currentBubbleID + 1] = strT;

                        // 缩放比例不调整

                        g_currentBubbleID++;
                        $("CURRENT_INNER_ORDER_NO").innerHTML = (g_currentBubbleID) + "";

                        g_bubblesFixedOrRandom = "1";
                        saveAllData();
                        setAllBySavedData();    // 按照已保存的数据绘制全部

                    }

                }


                // *********************************************************** editOuterPara ***********************************************************
                // 单击外部关联参量方块时显示编辑窗口
                function editOuterPara(no) {  // 从内存读取，放到文本框

                    var t;

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    g_tmpBlockClicked = 1;   // 鼠标悬浮移走后保持标记
                    g_currentBlockID = no;   // 保存刚被点击的长方块block序号
                    $("EDIT_OUTER_PARA_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_OUTER_PARA_BOX").style.zIndex = g_zIndexBox++;
                    $("outer_core_words").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 600 + (Math.random() * 60 - 30);
                    $("EDIT_OUTER_PARA_BOX").style.left = t + "px";

                    readAllData(); // 从数据区读取所有数据，放入内存

                    var tID;

                    $("CURRENT_OUTER_ORDER_NO").innerHTML = no;
                    $("outer_tag_words").value = g_blockText0[no];
                    $("outer_core_words").value = (g_blockText1[no] == "+关联词") ? "" : g_blockText1[no];
                    $("outer_key_words").value = g_blockText2[no];
                    $("outer_main_words").value = g_blockText3[no];

                    var lu = g_blockLink[no].trim();

                    var sameWin = lu.indexOf("(sw)", 0);     // 标记(sw) 表示“在父窗口(当前标签页)打开”，缺省或链接为空时在新标签页打开
                    if (sameWin == -1)  // 如果不在父窗口(当前标签页)，即在新标签页
                    {
                        $("outer_add_url_sw").checked = true;
                    }
                    else {
                        $("outer_add_url_sw").checked = false;
                    }

                    var autoFit = lu.indexOf("(af)", 0);     // 标记(af) 表示“图片尺寸自动适应”，缺省或链接为空时“保持原图尺寸”
                    if (autoFit == -1)  // 如果不自动适应，即保持原图尺寸
                    {
                        $("outer_add_url_af").checked = true;
                    }
                    else {
                        $("outer_add_url_af").checked = false;
                    }

                    if (lu == "") {
                        $("outer_add_url_sw").checked = false;
                        $("outer_add_url_af").checked = false;
                    }

                    $("outer_add_url").value = (lu.replace("(sw)", "")).replace("(af)", "");

                    $("outer_back_pic").value = g_blockPic[no];

                    setAllBySavedData();    // 按照已保存的数据绘制全部

                }


                // ********************************************************** changeOuterPara **********************************************************
                // 更新修改一个长方块block的显示信息，同时保存文件全部数据
                function changeOuterPara() {   // 全局变量 g_currentBlockID

                    $("EDIT_OUTER_PARA_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT, strT2;

                    tID = "O_P" + g_currentBlockID + "_T0";
                    $(tID).innerHTML = $("outer_tag_words").value;
                    g_blockText0[g_currentBlockID] = $("outer_tag_words").value;

                    tID = "O_P" + g_currentBlockID + "_T1_1";
                    $(tID).innerHTML = $("outer_core_words").value;
                    tID = "O_P" + g_currentBlockID + "_T1_2";
                    $(tID).innerHTML = $("outer_core_words").value;
                    g_blockText1[g_currentBlockID] = $("outer_core_words").value;

                    tID = "O_P" + g_currentBlockID + "_T2";
                    $(tID).innerHTML = $("outer_key_words").value;
                    g_blockText2[g_currentBlockID] = $("outer_key_words").value;

                    tID = "O_P" + g_currentBlockID + "_T3";
                    $(tID).innerHTML = $("outer_main_words").value;
                    g_blockText3[g_currentBlockID] = $("outer_main_words").value;

                    tID = "O_P" + g_currentBlockID + "_T4";
                    strT = $("outer_add_url").value.trim();;
                    strT2 = "";

                    // 标记(sw) 表示“在父窗口(当前标签页)打开”，缺省或链接为空时在新标签页打开
                    if ($("outer_add_url_sw").checked == false && strT != "") { strT2 = "(sw)"; }
                    // 标记(af) 表示auto fit, “尺寸自动适应”，缺省或链接为空时表示“保持原图尺寸”，但不允许超出内嵌窗口。仅限图片，html等无效
                    if ($("outer_add_url_af").checked == false && strT != "") { strT2 += "(af)"; }

                    g_blockLink[g_currentBlockID] = strT2 + strT.trim();

                    // 图片
                    strT = $("outer_back_pic").value.trim();
                    g_blockPic[g_currentBlockID] = strT;

                    saveAllData(); // 保存全部数据到数据区

                    setAllBySavedData();

                    g_tmpBlockClicked = 0;   // 鼠标悬浮高亮恢复

                }


                // ********************************************************** clearOuterPara ***********************************************************
                // 清除一个长方形块块的显示窗口的信息
                function clearOuterPara() {   // 全局变量 g_currentBubbleID

                    $("outer_tag_words").value = "";
                    $("outer_core_words").value = "";
                    $("outer_key_words").value = "";
                    $("outer_main_words").value = "";
                    $("outer_add_url").value = "";
                    $("outer_add_url_sw").checked = false;
                    $("outer_add_url_af").checked = false;
                    $("outer_back_pic").value = "";

                }


                // ******************************************************* decreaseOuterOrderNo ********************************************************
                // 降低一个长块块block的排序
                function decreaseOuterOrderNo() {   // 全局变量 g_currentBlockID

                    var strT;
                    if (g_currentBlockID > 1) {
                        strT = g_blockText0[g_currentBlockID];
                        g_blockText0[g_currentBlockID] = g_blockText0[g_currentBlockID - 1];
                        g_blockText0[g_currentBlockID - 1] = strT;

                        strT = g_blockText1[g_currentBlockID];
                        g_blockText1[g_currentBlockID] = g_blockText1[g_currentBlockID - 1];
                        g_blockText1[g_currentBlockID - 1] = strT;

                        strT = g_blockText2[g_currentBlockID];
                        g_blockText2[g_currentBlockID] = g_blockText2[g_currentBlockID - 1];
                        g_blockText2[g_currentBlockID - 1] = strT;

                        strT = g_blockText3[g_currentBlockID];
                        g_blockText3[g_currentBlockID] = g_blockText3[g_currentBlockID - 1];
                        g_blockText3[g_currentBlockID - 1] = strT;

                        strT = g_blockLink[g_currentBlockID];
                        g_blockLink[g_currentBlockID] = g_blockLink[g_currentBlockID - 1];
                        g_blockLink[g_currentBlockID - 1] = strT;

                        strT = g_blockPic[g_currentBlockID];
                        g_blockPic[g_currentBlockID] = g_blockPic[g_currentBlockID - 1];
                        g_blockPic[g_currentBlockID - 1] = strT;

                        g_currentBlockID--;
                        $("CURRENT_OUTER_ORDER_NO").innerHTML = (g_currentBlockID) + "";

                        g_bubblesFixedOrRandom = "1";
                        saveAllData();
                        setAllBySavedData();    // 按照已保存的数据绘制全部

                    }

                }


                // ******************************************************* increaseOuterOrderNo ********************************************************
                // 提升一个长块块block的排序
                function increaseOuterOrderNo() {   // 全局变量 g_currentBlockID

                    var strT;
                    if (g_currentBlockID < (g_oParaID.length - 1)) {
                        strT = g_blockText0[g_currentBlockID];
                        g_blockText0[g_currentBlockID] = g_blockText0[g_currentBlockID + 1];
                        g_blockText0[g_currentBlockID + 1] = strT;

                        strT = g_blockText1[g_currentBlockID];
                        g_blockText1[g_currentBlockID] = g_blockText1[g_currentBlockID + 1];
                        g_blockText1[g_currentBlockID + 1] = strT;

                        strT = g_blockText2[g_currentBlockID];
                        g_blockText2[g_currentBlockID] = g_blockText2[g_currentBlockID + 1];
                        g_blockText2[g_currentBlockID + 1] = strT;

                        strT = g_blockText3[g_currentBlockID];
                        g_blockText3[g_currentBlockID] = g_blockText3[g_currentBlockID + 1];
                        g_blockText3[g_currentBlockID + 1] = strT;

                        strT = g_blockLink[g_currentBlockID];
                        g_blockLink[g_currentBlockID] = g_blockLink[g_currentBlockID + 1];
                        g_blockLink[g_currentBlockID + 1] = strT;

                        strT = g_blockPic[g_currentBlockID];
                        g_blockPic[g_currentBlockID] = g_blockPic[g_currentBlockID + 1];
                        g_blockPic[g_currentBlockID + 1] = strT;

                        g_currentBlockID++;
                        $("CURRENT_OUTER_ORDER_NO").innerHTML = (g_currentBlockID) + "";

                        g_bubblesFixedOrRandom = "1";
                        saveAllData();
                        setAllBySavedData();    // 按照已保存的数据绘制全部

                    }

                }


                // ************************************************************ editLogo ***************************************************************
                // 单击Logo时显示修改窗口
                function editLogo() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_LOGO_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_LOGO_BOX").style.zIndex = g_zIndexBox++;
                    $("logo_pic").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 100 + (Math.random() * 60 - 30);
                    $("EDIT_LOGO_BOX").style.left = t + "px";
                    $("logo_pic").value = g_logoPic;

                }


                // ******************************************************** editBackPicMusic ***********************************************************
                // 单击背景图片/音乐...时显示修改窗口
                function editBackPicMusic() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_BACK_PIC_MUSIC_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_BACK_PIC_MUSIC_BOX").style.zIndex = g_zIndexBox++;
                    $("back_pic").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 100 + (Math.random() * 60 - 30);
                    $("EDIT_BACK_PIC_MUSIC_BOX").style.left = t + "px";
                    $("back_pic").value = g_backPic;
                    $("back_music").value = g_backMusic;

                }


                // ************************************************************ editTilte **************************************************************
                // 单击标题时显示修改窗口
                function editTitle() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_TITLE_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_TITLE_BOX").style.zIndex = g_zIndexBox++;
                    $("map_title").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 560 + (Math.random() * 60 - 30);
                    $("EDIT_TITLE_BOX").style.left = t + "px";

                    var tID;
                    tID = "MAP_TITLE";
                    if ($(tID).innerHTML == "+全息脑图标题") {
                        $("map_title").value = "";
                    }
                    else {
                        $("map_title").value = $(tID).innerHTML;
                    }

                    $("prev_page").value = g_prevPage;
                    $("next_page").value = g_nextPage;
                    $("home_page").value = g_homePage;
                    $("face_cover").value = g_faceCover;
                    $("back_cover").value = g_backCover;

                    if (g_sequentialPlay.trim() == "")  // 如果渐进式播放为空，意为不渐进。默认为""
                    {
                        $("sequential_play").checked = false;
                    }
                    else {
                        $("sequential_play").checked = true;
                    }

                    if (g_showTimeWhenPlay.trim() == "")  // 如果显示时间为空，意为不显示。默认为""
                    {
                        $("time_display").checked = false;
                    }
                    else {
                        $("time_display").checked = true;
                    }

                    if (g_storyLine.trim() == "")  // 如果故事线模式为空，意为不使用。默认为""
                    {
                        $("story_line").checked = false;
                    }
                    else {
                        $("story_line").checked = true;
                    }

                }


                // ******************************************************** forceIntoMobileMode ********************************************************
                // 进入移动模式。命令行指定参数 devmode = "m"。设备识别可能错误，此时可强制进入移动或电脑模式。
                function forceIntoMobileMode() {

                    var t = getHTMLSelfName();   // 获得本HTML文件名
                    t += "?devmode=m";
                    window.open(t, "_self");

                }


                // ********************************************************** forceIntoPCMode **********************************************************
                // 进入电脑模式。命令行指定参数 devmode = "c"。设备识别可能错误，此时可强制进入移动或电脑模式。
                function forceIntoPCMode() {

                    var t = getHTMLSelfName();   // 获得本HTML文件名
                    t += "?devmode=c";
                    window.open(t, "_self");

                }


                // ************************************************************* prevPage **************************************************************
                // 进入上一页，g_inFullScreen通知被调用的html打开时是否全屏播放
                function prevPage() {

                    if (g_prevPage != "") {

                        // 隐藏操作向导
                        hideShowGuideInfo();
                        // 隐藏全部编辑、菜单窗口
                        closeAllBoxes();

                        var t = g_prevPage;
                        var f = 3;  // 非全屏播放
                        if (g_inFullScreen) { f = 4; }   // 全屏播放
                        var n = g_prevPage.indexOf("?", 0);
                        if (n == -1) {
                            t = g_prevPage + "?func=" + f;
                        }
                        else {
                            t = g_prevPage + "&func=" + f;
                        }

                        // 传递设备模式
                        if (g_inMobileMode) {   // 如果运行在移动模式
                            t += "&devmode=m";   // 移动模式
                        } else {
                            t += "&devmode=c";   // 电脑模式
                        }

                        window.open(t, "_self");

                    }

                }


                // ************************************************************* nextPage **************************************************************
                // 进入下一页
                function nextPage() {

                    if (g_nextPage != "") {

                        // 隐藏操作向导
                        hideShowGuideInfo();
                        // 隐藏全部编辑、菜单窗口
                        closeAllBoxes();

                        var t = g_nextPage;
                        var f = 3;  // 非全屏播放
                        if (g_inFullScreen) { f = 4; }   // 全屏播放
                        var n = g_nextPage.indexOf("?", 0);
                        if (n == -1) {
                            t = g_nextPage + "?func=" + f;
                        }
                        else {
                            t = g_nextPage + "&func=" + f;
                        }

                        // 传递设备模式
                        if (g_inMobileMode) {   // 如果运行在移动模式
                            t += "&devmode=m";   // 移动模式
                        } else {
                            t += "&devmode=c";   // 电脑模式
                        }

                        window.open(t, "_self");

                    }

                }


                // ************************************************************* prevItem **************************************************************
                // 在正文页，高亮显示前一项:概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                // 在封面封底，多个图片切换到前一个
                function prevItem() {

                    // 移动设备触屏操作右上角“退出脑图”和左上角“重载脑图”，在播放时隐藏
                    if (g_inFullScreen) {
                        hideConfirmQuit();
                        hideConfirmReload();
                    }

                    // 隐藏操作向导
                    hideShowGuideInfo();
                    // 隐藏全部编辑、菜单窗口
                    closeAllBoxes();

                    if (!g_innerLinkShowing) {  // 内嵌链接没有显示，即，脑图没有被遮挡，此时要切换到前一项

                        // 封面
                        if (g_faceCoverShowing) {   // 如果各个封面在显示中，则显示前一个
                            g_faceCoverCurrentNo--;
                            if (g_faceCoverCurrentNo < 0) {  // 如果前面再没有图片
                                g_faceCoverCurrentNo = 0;
                                if (g_prevPage != "") {   // 如果存在上一页，则进入
                                    prevPage();
                                }
                            } else {
                                showCurrentFaceCover();
                            }
                        } else {

                            // 封底
                            if (g_backCoverShowing) {

                                // 逆序显示各个封底
                                g_backCoverCurrentNo--;
                                if (g_backCoverCurrentNo < 0) {  // 如果前面再没有图片了
                                    hideBackCover();     // 隐藏封底，显示正文页。
                                } else {  // 如果后面还有图片未显示
                                    showCurrentBackCover();
                                }

                            } else {

                                // 下面是除封面封底的正文
                                g_currentHighLightNo--;
                                // 概述前逆序显示各个封面
                                if (g_currentHighLightNo < 0) {
                                    g_currentHighLightNo = 0;
                                    g_faceCoverShowing = true;
                                    g_faceCoverCurrentNo--;
                                    showCurrentFaceCover();

                                    if (!g_faceCoverShowing && g_prevPage != "") {     // 如果存在上一页，则进入
                                        prevPage();
                                    }

                                }
                                // 概述
                                if (g_currentHighLightNo == 0) { deHighLightPrev(); highLightGenWords(); }
                                // 内部序参量
                                if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                                    while ((g_bubbleText0[g_currentHighLightNo - 1].toLowerCase().indexOf("(hide)") != -1)) {   // 如果该bubble隐藏（是未使用，而不是渐进播放时隐藏）则跳过。
                                        g_currentHighLightNo--;
                                    }
                                    deHighLightPrev();
                                    highLightBubble(g_currentHighLightNo - 1);
                                }
                                // 外部参量
                                if (g_currentHighLightNo >= 13) {
                                    deHighLightPrev();
                                    highLightBlock(g_currentHighLightNo - 12);
                                }
                                // 保存当前高亮号，为下一个去除高亮准备
                                g_deCurrentHighLightNo = g_currentHighLightNo;
                            }
                        }
                    } else {    // 内嵌链接页面正在显示，即，脑图被遮挡，此时要处理内嵌页面

                        // 处理泡泡、块块里的链接
                        // 获取url，存入tStr
                        // g_currentHighLightNo: 概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                        let tLinkStr = "";
                        // 内部序参量
                        if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                            tLinkStr = g_bubbleLink[g_currentHighLightNo - 1].trim();
                        }
                        // 外部参量
                        if (g_currentHighLightNo >= 13) {
                            tLinkStr = g_blockLink[g_currentHighLightNo - 12].trim();
                        }

                        // 打开当前的链接。第1个链接是在点击泡泡块块时，调用openFirstInnerLink(lk_url)打开的，此处继续
                        g_innerLinkCurrentNo--;
                        openCurrentInnerLink(tLinkStr);  // 此函数中，轮次打开各个链接，到头儿会自动关闭链接窗口，回到正文页

                    }

                }


                // ************************************************************ nextItem ***************************************************************
                // 在正文页，高亮显示后一项:概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                // 在封面封底，多个图片切换到后一个
                function nextItem() {

                    // 移动设备触屏操作右上角“退出脑图”和左上角“重载脑图”，在播放时隐藏
                    if (g_inFullScreen) {
                        hideConfirmQuit();
                        hideConfirmReload();
                    }

                    // 隐藏操作向导
                    hideShowGuideInfo();
                    // 隐藏全部编辑、菜单窗口
                    closeAllBoxes();

                    if (!g_innerLinkShowing) {  // 内嵌链接没有显示，即，脑图没有被遮挡，此时要切换到后一项

                        // 封面
                        if (g_faceCoverShowing) {   // 如果各个封面在显示中，则显示后一个

                            g_faceCoverCurrentNo++;
                            showCurrentFaceCover();  // 显示封面中的当前一页
                            g_currentHighLightNo = -1;
                            deHighLightAll();         // 去除所有高亮

                        } else {

                            // 封底
                            if (g_backCoverShowing) {

                                // 正序显示各个封底
                                g_backCoverCurrentNo++;
                                if (g_backCoverCurrentNo >= g_backCoverTotalNum) {  // 如果后面再没有图片了
                                    g_backCoverCurrentNo = g_backCoverTotalNum - 1;
                                    if (g_currentHighLightNo < 17) { hideBackCover(); }    // 隐藏封底：因修改封底数据时(changeTitle())会显示封底图片，在显示完后应隐藏，此时 g_currentHighLightNo < 17。
                                    if (g_nextPage != "" && g_currentHighLightNo >= 17) {   // 如果存在下一页，则进入。仅在播放到最后外部参量时。在修改封底数据时(changeTitle())不进入下一页。
                                        nextPage();
                                    }
                                } else {  // 如果后面还有图片未显示
                                    showCurrentBackCover();
                                }

                            } else {

                                // 下面是除封面封底的正文
                                g_currentHighLightNo++;
                                // 概述
                                if (g_currentHighLightNo == 0) { deHighLightPrev(); highLightGenWords(); }
                                // 内部序参量
                                if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                                    while (g_currentHighLightNo <= 12 && (g_bubbleText0[g_currentHighLightNo - 1].toLowerCase().indexOf("(hide)") != -1)) {   // 如果该bubble隐藏（是未使用，而不是渐进播放时隐藏）则跳过。
                                        g_currentHighLightNo++;
                                    }
                                    deHighLightPrev();
                                    if (g_currentHighLightNo < 13) {    // 最后一个bubble,跳到block
                                        highLightBubble(g_currentHighLightNo - 1);
                                    } else {
                                        highLightBlock(g_currentHighLightNo - 12);
                                    }
                                }
                                // 外部参量
                                if (g_currentHighLightNo >= 13 && g_currentHighLightNo <= 17) {
                                    deHighLightPrev();
                                    highLightBlock(g_currentHighLightNo - 12);
                                }
                                // 外部参量后正序显示各个封底
                                if (g_currentHighLightNo > 17 && !g_backCoverShowing) {   // 此处是真正进入封底
                                    g_backCoverShowing = true;
                                    g_backCoverCurrentNo = 0;
                                    showCurrentBackCover();

                                    if (!g_backCoverShowing && g_nextPage != "") {     // 如果存在下一页，则进入
                                        nextPage();
                                    }

                                    g_currentHighLightNo = 17;
                                }

                                // 保存当前高亮号，为下一个去除高亮准备
                                g_deCurrentHighLightNo = g_currentHighLightNo;

                                // 在全屏播放时，保存已经显示过的最大高亮号，用于渐进式播放时控制显示到哪里
                                if (g_inFullScreen && g_currentHighLightNo > g_maxHighLightNo) { g_maxHighLightNo = g_currentHighLightNo; }
                            }
                        }
                    } else {    // 内嵌链接页面正在显示，即，脑图被遮挡，此时要处理内嵌页面

                        // 处理泡泡、块块里的链接
                        // 获取url，存入tStr
                        // g_currentHighLightNo: 概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                        let tLinkStr = "";
                        // 内部序参量
                        if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                            tLinkStr = g_bubbleLink[g_currentHighLightNo - 1].trim();
                        }
                        // 外部参量
                        if (g_currentHighLightNo >= 13) {
                            tLinkStr = g_blockLink[g_currentHighLightNo - 12].trim();
                        }

                        // 打开当前的链接。第1个链接是在点击泡泡块块时，调用openFirstInnerLink(lk_url)打开的，此处继续
                        g_innerLinkCurrentNo++;
                        openCurrentInnerLink(tLinkStr);  // 此函数中，轮次打开各个链接，到头儿会自动关闭链接窗口，回到正文页

                    }

                }


                // ************************************************************ homePage ***************************************************************
                // 进入起始页
                function homePage() {

                    if (g_homePage != "") {

                        // 隐藏操作向导
                        hideShowGuideInfo();
                        // 隐藏全部编辑、菜单窗口
                        closeAllBoxes();

                        var t = g_homePage;
                        var f = 3;  // 非全屏播放
                        if (g_inFullScreen) { f = 4; }   // 全屏播放
                        var n = g_homePage.indexOf("?", 0);
                        if (n == -1) {
                            t = g_homePage + "?func=" + f;
                        }
                        else {
                            t = g_homePage + "&func=" + f;
                        }

                        // 传递设备模式
                        if (g_inMobileMode) {   // 如果运行在移动模式
                            t += "&devmode=m";   // 移动模式
                        } else {
                            t += "&devmode=c";   // 电脑模式
                        }

                        window.open(t, "_self");

                    }

                }


                // ******************************************************** showLogoPic ****************************************************************
                // 显示Logo
                function showLogoPic() {

                    if (g_logoPic == "") {
                        $("LOGO_PIC_IMG").style.display = "none";    // 隐藏用户Logo
                        $("AHMM_LOGO_TEXT").style.display = "block"; // 显示 AHMM Logo
                        $("LOGO_PIC_IMG3").style.display = "none";   // 封面上的
                        $("AHMM_LOGO_TEXT3").style.display = "block";
                    }
                    else {
                        $("LOGO_PIC_IMG").src = g_logoPic;
                        $("LOGO_PIC_IMG").style.display = "block";  // 显示用户Logo
                        $("AHMM_LOGO_TEXT").style.display = "none"; // 隐藏 AHMM LOGO
                        $("LOGO_PIC_IMG3").src = g_logoPic;         // 封面上的
                        $("LOGO_PIC_IMG3").style.display = "block";
                        $("AHMM_LOGO_TEXT3").style.display = "none";
                    }

                }


                // ******************************************************** showBackPicMusic ***********************************************************
                // 显示背景图片。背景音乐不播放，全屏播放脑图时播放
                function showBackPicMusic() {

                    // 背景图片
                    if (g_backPic == "") {
                        $("BACK_PIC_IMG").style.display = "none";    // 隐藏背景图片
                    }
                    else {
                        setAttr("BACK_PIC_IMG", "href", g_backPic);
                        $("BACK_PIC_IMG").style.display = "block";  // 显示背景图片
                    }

                    // 背景音乐，不自动播放
                    $("BACK_MUSIC").src = g_backMusic;

                }


                // ***************************************************** showCurrentFaceCover **********************************************************
                // 显示封面中的当前一页：如果存在则显示，如果不存在则不显示。多个封面（即存在封二、封三、...）时，依次显示
                // 各个封面图片文件名存在g_faceCover，各图片名用空格分隔，形如：g_faceCover="1.jpg 2.jpg 3.jpg"
                function showCurrentFaceCover() {

                    // 拆解封面各个图片文件名
                    // 对封面图片文件名的总字符串，使用正则表达式替换多个连续空格为一个空格
                    let str = g_faceCover.trim();
                    str = str.replace(/\s+/g, " ");
                    // 使用空格作为分隔符将字符串分割成数组，这样arr[0]、arr[1]...即为各个图片的文件名
                    let arr = str.split(" ");
                    let n = arr.length;
                    g_faceCoverTotalNum = n;

                    if (arr[g_faceCoverCurrentNo] == "" || g_faceCoverCurrentNo >= n || g_faceCoverCurrentNo < 0) {
                        $("FACE_COVER").style.display = "none"; // 隐藏封面
                        g_faceCoverShowing = false;
                    }
                    else {
                        $("FACE_COVER_IMG").src = arr[g_faceCoverCurrentNo];
                        $("FACE_COVER").style.display = "block"; // 显示封面
                        g_faceCoverShowing = true;     // 用于播放时的键盘和翻页笔控制，nextItem()、prevItem()
                    }

                    if (g_faceCoverCurrentNo > n) { g_faceCoverCurrentNo = n; }
                    if (g_faceCoverCurrentNo < 0) { g_faceCoverCurrentNo = 0; }

                }


                // **************************************************** showCurrentBackCover ***********************************************************
                // 显示封底中的当前一页：如果存在则显示，如果不存在则不显示。多个封底（即存在封底二、封底三、...）时，依次显示
                // 各个封底图片文件名存在g_backCover，各图片名用空格分隔，形如：g_faceCover="1.jpg 2.jpg 3.jpg"
                function showCurrentBackCover() {

                    // 拆解封底各个图片文件名
                    // 对封底图片文件名的总字符串，使用正则表达式替换多个连续空格为一个空格
                    let str = g_backCover.trim();
                    str = str.replace(/\s+/g, " ");
                    // 使用空格作为分隔符将字符串分割成数组，这样arr[0]、arr[1]...即为各个图片的文件名
                    let arr = str.split(" ");
                    let n = arr.length;
                    g_backCoverTotalNum = n;

                    if (arr[g_backCoverCurrentNo] == "" || g_backCoverCurrentNo >= n || g_backCoverCurrentNo < 0) {
                        $("BACK_COVER").style.display = "none"; // 隐藏封底
                        g_backCoverShowing = false;
                    }
                    else {
                        $("BACK_COVER_IMG").src = arr[g_backCoverCurrentNo];
                        $("BACK_COVER").style.display = "block"; // 显示封底
                        g_backCoverShowing = true;     // 用于播放时的键盘和翻页笔控制，nextItem()、prevItem()
                    }

                    if (g_backCoverCurrentNo > n) { g_backCoverCurrentNo = n; }
                    if (g_backCoverCurrentNo < 0) { g_backCoverCurrentNo = 0; }

                }


                // ********************************************************** hideFaceCover *************************************************************
                // 隐藏封面
                function hideFaceCover() {

                    $('FACE_COVER').style.display = 'none';
                    $('FACE_COVER_IMG').src = '';
                    g_faceCoverShowing = false;

                }


                // ********************************************************** hideBackCover *************************************************************
                // 隐藏封底
                function hideBackCover() {

                    $('BACK_COVER').style.display = 'none';
                    $('BACK_COVER_IMG').src = '';
                    g_backCoverShowing = false;

                }


                // ********************************************************** changeTitle **************************************************************
                // 修改标题
                function changeTitle() {

                    $("EDIT_TITLE_BOX").style.display = "none";   // 隐藏标题编辑窗口

                    var tID, strT, n;

                    strT = $("map_title").value;
                    tID = "MAP_TITLE";
                    $(tID).innerHTML = strT;
                    tID = "BROWSER_TITLE";
                    n = strT.indexOf("阿色全息脑图");
                    $(tID).innerHTML = strT;
                    if (n == -1) {
                        $(tID).innerHTML = "ahmm-" + strT.replace(/\s/g, "_");   // 保存html时去掉空格，否则很多地方不兼容
                    }
                    g_mapTitle = $("map_title").value;
                    g_prevPage = $("prev_page").value.trim();
                    g_nextPage = $("next_page").value.trim();
                    g_homePage = $("home_page").value.trim();
                    g_faceCover = $("face_cover").value.trim();
                    g_backCover = $("back_cover").value.trim();

                    if ($("sequential_play").checked == true)  // 如果渐进式播放选中，则g_sequentialPlay="1"。默认为""
                    {
                        g_sequentialPlay = "1";
                    }
                    else {
                        g_sequentialPlay = "";
                    }

                    if ($("time_display").checked == true)  // 如果显示时间选中，则g_showTimeWhenPlay="1"。默认为""
                    {
                        g_showTimeWhenPlay = "1";
                    }
                    else {
                        g_showTimeWhenPlay = "";
                    }

                    if ($("story_line").checked == true)  // 如果故事线模式选中，则g_storyLine="1"。默认为""
                    {
                        g_storyLine = "1";
                    }
                    else {
                        g_storyLine = "";
                    }

                    g_saveFaceCoverOrNot = 1;   // 只有设置封面时才为1，setLogoTitleAuthorGenWords()根据此值=1时才设置封面src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    g_saveBackCoverOrNot = 1;   // 封底，同封面

                    saveAllData(); // 保存全部数据到数据区

                    setAllBySavedData();   // 根据数据存储区的数据放置所有部件

                    // 当存在封面时，显示
                    g_faceCoverCurrentNo = 0;
                    showCurrentFaceCover();
                    // 当存在封底时，显示
                    g_backCoverCurrentNo = 0;
                    showCurrentBackCover();

                }


                // ********************************************************** clearTitle ***************************************************************
                // 清除标题编辑窗口信息
                function clearTitle() {

                    $("map_title").value = "";
                    $("prev_page").value = "";
                    $("next_page").value = "";
                    $("home_page").value = "";
                    $("face_cover").value = "";
                    $("back_cover").value = "";
                    $("sequential_play").checked = false;
                    $("time_display").checked = false;
                    $("story_line").checked = false;

                }


                // ********************************************************** changeLogo ***************************************************************
                // 修改Logo
                function changeLogo() {

                    $("EDIT_LOGO_BOX").style.display = "none";   // 隐藏Logo窗口
                    g_logoPic = $("logo_pic").value.trim();
                    g_saveLogoPicOrNot = 1;   // 只有设置Logo时才为1，setLogoTitleAuthorGenWords()根据此值=1时才设置Logo src，其他修改时不设置，为了避免保存脑图是出现file文件夹

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();
                    showLogoPic(); // 当存在Logo时，显示

                }


                // ****************************************************** changeBackPicMusic ***********************************************************
                // 修改背景图片/音乐
                function changeBackPicMusic() {

                    $("EDIT_BACK_PIC_MUSIC_BOX").style.display = "none";   // 隐藏背景图片音乐窗口
                    g_backPic = $("back_pic").value.trim();
                    g_saveBackPicOrNot = 1;   // 只有设置背景图片时才为1，setLogoTitleAuthorGenWords()根据此值=1时才设置背景图片 src，其他修改时不设置，为了避免保存脑图是出现file文件夹
                    g_backMusic = $("back_music").value.trim();
                    g_saveBackMusicOrNot = 1;   // 只有设置背景音乐时才为1，setLogoTitleAuthorGenWords()根据此值=1时才设置背景音乐 src，其他修改时不设置，为了避免保存脑图是出现file文件夹

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();
                    showBackPicMusic(); // 当存在背景图片时，显示

                }


                // ************************************************************ clearLogo **************************************************************
                // 清除Logo编辑窗口信息
                function clearLogo() {

                    $("logo_pic").value = "";

                }


                // ******************************************************** clearBackPicMusic **********************************************************
                // 清除背景图片编辑窗口信息
                function clearBackPicMusic() {

                    $("back_pic").value = "";
                    $("back_music").value = "";

                }


                // *********************************************************** editAuthor **************************************************************
                // 单击页脚（作者、备注、制作支持信息）时显示修改窗口
                function editAuthor() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_AUTHOR_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_AUTHOR_BOX").style.top = (g_mainHeight + Y_MARGIN + Y_TOPIC_HEIGHT - 350) + "px";
                    $("EDIT_AUTHOR_BOX").style.zIndex = g_zIndexBox++;
                    $("copyright_info").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 120 + (Math.random() * 60 - 30);
                    $("EDIT_AUTHOR_BOX").style.left = t + "px";

                    var tID;
                    // 标注版权等
                    tID = "AUTHOR_DATE";
                    $("copyright_info").value = $(tID).innerHTML;

                    // 设置隐藏制作支持信息
                    if (g_hideSupportInfo == 1) {
                        $("hide_support_info").checked = true;
                    }
                    else {
                        $("hide_support_info").checked = false;
                    }

                }


                // ********************************************************** changeAuthor *************************************************************
                // 修改页脚（作者、备注、制作支持信息）
                function changeAuthor() {

                    $("EDIT_AUTHOR_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT;

                    // 版权、作者
                    tID = "AUTHOR_DATE";
                    $(tID).innerHTML = $("copyright_info").value;
                    g_authorDate = $("copyright_info").value;

                    // 制作支持信息
                    tID = "SUPPORT_INFO";
                    if ($("hide_support_info").checked == true) {
                        g_hideSupportInfo = 1;
                        $(tID).style.display = "none";
                    }
                    else {
                        g_hideSupportInfo = 0;
                        $(tID).style.display = "";    // 不能用block，否则会换行
                    }

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();

                }


                // ********************************************************** clearAuthor **************************************************************
                // 清除作者编辑窗口信息
                function clearAuthor() {

                    $("copyright_info").value = "";

                }


                // ********************************************************** editInMark ***************************************************************
                // 单击左标签内部序参量时显示修改窗口
                function editInMark() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_IN_MARK_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_IN_MARK_BOX").style.top = (g_mainHeight + Y_MARGIN + Y_TOPIC_HEIGHT - 550) + "px";
                    $("EDIT_IN_MARK_BOX").style.zIndex = g_zIndexBox++;
                    $("in_mark_text").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击变了
                    t = 150 + (Math.random() * 20 - 10);
                    $("EDIT_IN_MARK_BOX").style.left = t + "px";

                    var tID;
                    // 标注左标签
                    tID = "IN_MARK";
                    $("in_mark_text").value = $(tID).innerHTML;

                }


                // ********************************************************** changeInMark *************************************************************
                // 编辑左标签
                function changeInMark() {

                    $("EDIT_IN_MARK_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT;

                    // 左标签
                    tID = "IN_MARK";
                    $(tID).innerHTML = $("in_mark_text").value;
                    g_inMark = $("in_mark_text").value;

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();
                    resetInMarkOutMark();

                }


                // ********************************************************** clearInMark **************************************************************
                // 清除编辑左标签窗口信息
                function clearInMark() {

                    $("in_mark_text").value = "";

                }


                // ********************************************************** editOutMark **************************************************************
                // 单击右标签内部序参量时显示修改窗口
                function editOutMark() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_OUT_MARK_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_OUT_MARK_BOX").style.top = (g_mainHeight + Y_MARGIN + Y_TOPIC_HEIGHT - 550) + "px";
                    $("EDIT_OUT_MARK_BOX").style.zIndex = g_zIndexBox++;
                    $("out_mark_text").focus();

                    // 让窗口随机挪动一下，否则感受不到被点击变了
                    t = 1360 + (Math.random() * 20 - 10);
                    $("EDIT_OUT_MARK_BOX").style.left = t + "px";

                    var tID;
                    // 标注右标签
                    tID = "OUT_MARK";
                    $("out_mark_text").value = $(tID).innerHTML;

                }


                // ********************************************************* changeOutMark *************************************************************
                // 编辑右标签
                function changeOutMark() {

                    $("EDIT_OUT_MARK_BOX").style.display = "none";   // 隐藏编辑窗口

                    var tID, tID2, strT;

                    // 右标签
                    tID = "OUT_MARK";
                    $(tID).innerHTML = $("out_mark_text").value;
                    g_outMark = $("out_mark_text").value;

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();
                    resetInMarkOutMark();

                }


                // ********************************************************* clearOutMark **************************************************************
                // 清除编辑右标签窗口信息
                function clearOutMark() {

                    $("out_mark_text").value = "";

                }


                // ********************************************************* editGenWords **************************************************************
                // 单击概述时显示修改窗口
                function editGenWords() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllMenuBoxes();   // 隐藏右侧下拉菜单

                    $("EDIT_GEN_WORDS_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("EDIT_GEN_WORDS_BOX").style.zIndex = g_zIndexBox++;
                    $("gen_info").focus();

                    $("EDIT_GEN_WORDS_BOX").style.top = "420px";
  
                    // 让窗口随机挪动一下，否则感受不到被点击的圆泡泡bubble变了
                    t = 200 + (Math.random() * 60 - 30);
                    $("EDIT_GEN_WORDS_BOX").style.left = t + "px";

                    $("gen_info").value = g_genWords;

                }


                // ******************************************************** changeGenWords *************************************************************
                // 编辑概述
                function changeGenWords() {

                    $("EDIT_GEN_WORDS_BOX").style.display = "none";   // 隐藏编辑窗口

                    g_genWords = $("gen_info").value;
                    processGenWords();

                    saveAllData(); // 保存全部数据到数据区

                }


                // ********************************************************* clearGenWords *************************************************************
                // 清空概述
                function clearGenWords() {
                    $("gen_info").value = "";
                }


                // ******************************************************* showHideFuncMenu ************************************************************
                // 单击功能菜单 ≚ ≙时显示和收起菜单窗口
                function showHideFuncMenu() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllEditBoxes();   // 隐藏全部内外部变量等编辑窗口

                    $("FUNCTION_MENU_BOX").style.zIndex = g_zIndexBox++;
                    $("FUNCTION_MENU_BOX").style.left = (g_menuCharLeft + 15) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.zIndex = g_zIndexBox++;
                    $("FUNCTION_MENU_BOX_ARROW").style.left = (g_menuCharLeft + 4) + "px";

                    if ($("FUNCTION_MENU_BOX").style.display == "none") {
                        $("FUNCTION_MENU_BOX").style.display = "block";  // 显示菜单窗口，display="none"; 表示关闭
                        $("MENU_CHAR").innerHTML = "≙";
                        $("MENU_CHAR").title = "收起【功能菜单】";
                    }
                    else {
                        closeMenuBox();
                        $("MENU_CHAR").innerHTML = "≚";
                    }

                }


                // *************************************************************************************************************************************************
                // **************************************************************** 功能菜单各个按键 ***************************************************************
                // *************************************************************************************************************************************************

                // 新建全息脑图
                function newAHMM() {
                    closeMenuBox();
                    restoreFullScreenChar();
                    var selfHTMLFileName;
                    selfHTMLFileName = getHTMLSelfName() + "?func=2";

                    // 传递设备模式
                    if (g_inMobileMode) {   // 如果运行在移动模式
                        selfHTMLFileName += "&devmode=m";   // 移动模式
                    } else {
                        selfHTMLFileName += "&devmode=c";   // 电脑模式
                    }

                    // 传递基因信息。注意：对于新图而言，其父为当前的脑图
                    let tStrGene = "";
                    // 传递当前脑图的ID给新建的子图，作为子图的父ID
                    tStrGene = "&fid=" + $("P_D_SELF_ID").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的代次给新建的子图，作为子图的父代次
                    tStrGene = "&fgene=" + $("P_D_SELF_GENERATION").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的titel给新建的子图，作为子图的父图的title
                    tStrGene = "&ftitle=" + $("P_D_TITLE").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的版权信息给新建的子图，作为子图的父图的版权信息
                    tStrGene = "&finfo=" + $("P_D_AUTHOR").innerHTML;
                    selfHTMLFileName += tStrGene;
                    selfHTMLFileName = selfHTMLFileName.replace(/&nbsp;/g, ' ');   // 把"&nbsp;"替换为" "

                    window.open(selfHTMLFileName);
                }

                // AI自动生成脑图
                function newAIAHMM() {
                    closeMenuBox();
                    restoreFullScreenChar();
                    window.open("http://www.holomind.com.cn/ahmm/ai/ai2ahmm.html");
                }

                // 复制当前脑图
                function newAHMMCopy() {
                    closeMenuBox();
                    restoreFullScreenChar();
                    var selfHTMLFileName;
                    selfHTMLFileName = getHTMLSelfName() + "?func=6";

                    // 传递复制示例模式
                    // 如果在示例界面复制脑图，则传递参数 exm="1"
                    // 复制到新脑图时，根据此参数将示例数据复制到新脑图
                    if (g_funcMode == "1") {    
                        selfHTMLFileName += "&exm=1";
                    }

                    // 传递设备模式
                    if (g_inMobileMode) {   // 如果运行在移动模式
                        selfHTMLFileName += "&devmode=m";   // 移动模式
                    } else {
                        selfHTMLFileName += "&devmode=c";   // 电脑模式
                    }

                    // 传递基因信息。注意：对于新图而言，其父为当前的脑图
                    let tStrGene = "";
                    // 传递当前脑图的ID给新建的子图，作为子图的父ID
                    tStrGene = "&fid=" + $("P_D_SELF_ID").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的代次给新建的子图，作为子图的父代次
                    tStrGene = "&fgene=" + $("P_D_SELF_GENERATION").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的titel给新建的子图，作为子图的父图的title
                    tStrGene = "&ftitle=" + $("P_D_TITLE").innerHTML;
                    selfHTMLFileName += tStrGene;
                    // 传递当前脑图的版权信息给新建的子图，作为子图的父图的版权信息
                    tStrGene = "&finfo=" + $("P_D_AUTHOR").innerHTML;
                    selfHTMLFileName += tStrGene;
                    selfHTMLFileName = selfHTMLFileName.replace(/&nbsp;/g, ' ');   // 把"&nbsp;"替换为" "

                    window.open(selfHTMLFileName);
                }

                // 保存全息脑图
                function saveAHMM() {
                    $("SHOW_SAVE_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("SHOW_SAVE_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_SAVE_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 3) + "px";
                    $("SHOW_SAVE_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("SHOW_SAVE_BOX").style.width) - 52) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 3) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowRestore();
                    hideShowClean();
                    hideShowConfirm();
                    hideShowHide();
                    hideShowGene();
                }

                // 恢复编辑历史
                function restoreEditHistory() {
                    $("SHOW_RESTORE_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("SHOW_RESTORE_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_RESTORE_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 4) + "px";
                    $("SHOW_RESTORE_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("SHOW_CLEAN_BOX").style.width) - 12) + "px";
                    $("MENU_TEXT3").innerHTML = "当前编号：" + (parseInt(g_editHistoryNo)) + "/" + EDIT_HISTORY_TATAL_NUM;
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 4) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowClean();
                    hideShowConfirm();
                    hideShowHide();
                    hideShowGene();
                }

                // 清空脑图内容
                function cleanAHMM() {
                    $("SHOW_CLEAN_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("SHOW_CLEAN_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_CLEAN_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 5) + "px";
                    $("SHOW_CLEAN_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("SHOW_CLEAN_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 5) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowConfirm();
                    hideShowHide();
                    hideShowGene();

                }

                // 重排主题词
                function resetAHMM() {
                    g_changeTypeOnFuncMenu = 1;  // 让changeSelectUp()执行重排脑图，changeSelectUp()是几个切换功能共用的窗口，所以要用全局变量区分一下要执行的动作
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "重排主题词";
                    $("MENU_TEXT").innerHTML = "随机排布，可拖动";
                    if (g_storyLine.trim() != "") { $("MENU_TEXT").innerHTML = "对齐排布，可拖动"; }
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 6) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 6) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                }

                // 更改脑图配色
                function changeAHMMColor() {
                    g_changeTypeOnFuncMenu = 2;
                    g_restoreColorSetNo = g_colorSetNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改脑图配色";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_colorSetNo + 1) + "/" + COLOR_SET_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 7) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 7) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 更改颜色透明
                function changeColorOpacity() {
                    g_changeTypeOnFuncMenu = 3;
                    g_restoreColorOpacityNo = g_colorOpacityNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改颜色透明";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_colorOpacityNo + 1) + "/" + COLOR_OPACITY_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 8) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 8) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 更改文字颜色
                function changeTextColor() {
                    g_changeTypeOnFuncMenu = 4;
                    g_restoreTextColorNo = g_textColorNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改文字颜色";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_textColorNo + 1) + "/" + TEXT_COLOR_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 9) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 9) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 更改边线颜色
                function changeBorderColor() {
                    g_changeTypeOnFuncMenu = 5;
                    g_restoreBorderColorNo = g_borderColorNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改边线颜色";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_borderColorNo + 1) + "/" + BORDER_COLOR_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 10) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 10) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 更改边线宽度
                function changeBorderLine() {
                    g_changeTypeOnFuncMenu = 6;
                    g_restoreBorderWidthNo = g_borderWidthNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改边线宽度";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_borderWidthNo + 1) + "/" + BORDER_WIDTH_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 11) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 11) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 更改背景颜色
                function changeBackgroundColor() {
                    g_changeTypeOnFuncMenu = 7;
                    g_restoreBackgroundColorNo = g_backgroundColorNo;
                    $("FUNCTION_CONFIRM_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("FUNCTION_CONFIRM_BOX").style.zIndex = g_zIndexBox++;
                    $("MENU_TITLE").innerHTML = "更改背景颜色";
                    $("MENU_TEXT").innerHTML = "当前编号：" + (g_backgroundColorNo + 1) + "/" + BACKGROUND_COLOR_TOTAL_NUM;    // 数组0号，显示为1号
                    $("FUNCTION_CONFIRM_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 40 * 12) + "px";
                    $("FUNCTION_CONFIRM_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("FUNCTION_CONFIRM_BOX").style.width) - 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 12) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    g_bubblesFixedOrRandom = "1";
                }

                // 显示/隐藏主题词
                function showHideBubbles() {
                    $("SHOW_HIDE_BOX").style.display = "block";  // 显示主题词隐藏否窗口，display="none"; 表示关闭
                    $("SHOW_HIDE_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_HIDE_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("SHOW_HIDE_BOX").style.width) - 52) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top = (42 + 40 * 13) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";

                    // 设置checked
                    var i, strT, n, tID;
                    for (i = 1; i < g_iParaID.length; i++) {
                        tID = "I_P" + i + "_T0";
                        strT = $(tID).innerHTML;
                        n = strT.indexOf("(hide)");
                        if (n == -1) {
                            $("show_hide_" + i).checked = true;
                        }
                        else {
                            $("show_hide_" + i).checked = false;
                        }

                        $("SHOW_HIDE_TEXT_" + i).innerHTML = $("I_P" + i + "_T1_2").innerHTML;
                    }  // for end

                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowConfirm();
                    hideShowGene();
                }

                // 显示脑图基因
                function showAHMMGene() {
                    $("SHOW_GENE_BOX").style.display = "block";  // 显示基因窗口，display="none"; 表示关闭
                    $("SHOW_GENE_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_GENE_BOX").style.left = (parseInt($("FUNCTION_MENU_BOX").style.left) - parseInt($("SHOW_GENE_BOX").style.width) - 52) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.top =  (42 + 40 * 14) + "px";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "block";

                    // 显示数据区中各项基因数据
                    // 如果父脑图ID为-1，则说明本文件是初始文件ahmm.html

                    $("SELF_AHMM_TITLE").innerHTML = $("P_D_TITLE").innerHTML;
                    if ($("P_D_FATHER_ID").innerHTML.trim() == "-1") {   // 初始文件

                        // 本脑图
                        $("SELF_AHMM_ID").innerHTML = "0";
                        $("SELF_AHMM_GENE_NUM").innerHTML = "0";
                        $("SELF_AHMM_CREATION_TIME").innerHTML = AHMM_CREATION_TIME;
                        $("SELF_AHMM_LAST_TIME").innerHTML = AHMM_LAST_TIME;
                        $("SELF_AHMM_CREATION_VERSION").innerHTML = AHMM_CREATION_VERSION;

                        // 父脑图
                        $("FATHER_AHMM_ID").innerHTML = "无。本脑图为全息脑图初始文件ahmm.html";
                        $("FATHER_AHMM_TITLE").innerHTML = "大系统观阿色全息脑图AHMM";
                        $("FATHER_AHMM_INFO").innerHTML = "自由使用 自由复制 自由分享 / 版权所有: 阿色";

                    } else {   // 衍生的文件

                        // 本脑图
                        $("SELF_AHMM_ID").innerHTML = $("P_D_SELF_ID").innerHTML;
                        $("SELF_AHMM_GENE_NUM").innerHTML = $("P_D_SELF_GENERATION").innerHTML;
                        $("SELF_AHMM_CREATION_TIME").innerHTML = $("P_D_SELF_CREATION_TIME").innerHTML;
                        $("SELF_AHMM_LAST_TIME").innerHTML = $("P_D_SELF_LAST_TIME").innerHTML;
                        $("SELF_AHMM_CREATION_VERSION").innerHTML = $("P_D_SELF_CREATION_VERSION").innerHTML;

                        // 父脑图
                        $("FATHER_AHMM_ID").innerHTML = $("P_D_FATHER_ID").innerHTML;
                        $("FATHER_AHMM_TITLE").innerHTML = $("P_D_FATHER_TITLE").innerHTML;
                        $("FATHER_AHMM_INFO").innerHTML = $("P_D_FATHER_INFO").innerHTML;

                    }

                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowConfirm();
                    hideShowHide();

                }


                // 全息脑图示例
                function introAHMM() {
                    closeMenuBox();
                    restoreFullScreenChar();
                    var selfHTMLFileName;
                    selfHTMLFileName = getHTMLSelfName() + "?func=1";

                    // 传递设备模式
                    if (g_inMobileMode) {   // 如果运行在移动模式
                        selfHTMLFileName += "&devmode=m";   // 移动模式
                    } else {
                        selfHTMLFileName += "&devmode=c";   // 电脑模式
                    }

                    window.open(selfHTMLFileName);
                }

                // 显示使用说明
                function showManual() {

                    // 检查最新版本
                    if (g_lastVersionNo == "0") {
                        $("LAST_VERSION").innerHTML = "未知";
                        $("LAST_VERSION_TEXT").innerHTML = "可能存在版本更新，请联网查看，旧版本可继续使用";
                    }
                    else {
                        $("LAST_VERSION").innerHTML = g_lastVersionNo;
                        if (g_lastVersionNo == AHMM_VERSION) {
                            $("LAST_VERSION_TEXT").innerHTML = "您使用的是最新版本，联网可获得更新信息";
                        }
                        else {
                            $("LAST_VERSION_TEXT").innerHTML = '<span style="color:#FF0000">您使用的不是最新版本，可到网站下载最新版本</span>';
                        }
                    }

                    $("SHOW_MANUAL_BOX").style.display = "block";  // 显示编辑窗口，display="none"; 表示关闭
                    $("SHOW_MANUAL_BOX").style.zIndex = g_zIndexBox++;
                    $("SHOW_MANUAL_BOX").style.top = (parseInt($("FUNCTION_MENU_BOX").style.top) + 20) + "px";
                    $("SHOW_MANUAL_BOX").style.left = (SCREEN_WIDTH_STANDARD / 2 - parseInt($("SHOW_MANUAL_BOX").style.width) / 2) + "px";
                    closeMenuBox();
                }


                // 为升级文件新建全息脑图
                function newAHMMForUpdate() {
                    closeMenuBox();
                    restoreFullScreenChar();
                    var selfHTMLFileName;
                    selfHTMLFileName = getHTMLSelfName() + "?func=5";

                    // 传递设备模式
                    if (g_inMobileMode) {   // 如果运行在移动模式
                        selfHTMLFileName += "&devmode=m";   // 移动模式
                    } else {
                        selfHTMLFileName += "&devmode=c";   // 电脑模式
                    }

                    window.open(selfHTMLFileName);
                }

                // 收起功能菜单
                function closeMenuBox() {
                    hideShowMenu();
                    hideShowConfirm();
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowHide();
                    hideShowGene();
                    $("MENU_CHAR").innerHTML = "≚";
                    $("MENU_CHAR").title = "【功能菜单】";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "none";
                }

                // 切换选择上升
                function changeSelectUp() { // g_changeTypeOnFuncMenu 指定切换内容：重排、颜色、线型

                    var n;
                    switch (g_changeTypeOnFuncMenu) {

                        case 1:  // 重排主题词
                            randSetBubblesAndResetALLBySavedData(0);   // 随机重排泡泡，并按照已保存的数据绘制全部
                            if (g_storyLine.trim() != "") {$("MENU_TEXT").innerHTML = "当前编号：" + g_arrangeNo + "/" + g_arrangeTotalNum;}
                            break;

                        case 2: // 更改脑图配色
                            n = g_colorSetNo;
                            n++;
                            n = (n % COLOR_SET_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + COLOR_SET_TOTAL_NUM;
                            g_colorSetNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 3:  // 更改颜色透明
                            n = g_colorOpacityNo;
                            n++;
                            n = (n % COLOR_OPACITY_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + COLOR_OPACITY_TOTAL_NUM;
                            g_colorOpacityNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 4:  // 更改文字颜色
                            n = g_textColorNo;
                            n++;
                            n = (n % TEXT_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + TEXT_COLOR_TOTAL_NUM;
                            g_textColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 5:  // 更改边线颜色
                            n = g_borderColorNo;
                            n++;
                            n = (n % BORDER_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BORDER_COLOR_TOTAL_NUM;
                            g_borderColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 6:  // 更改边线宽度
                            n = g_borderWidthNo;
                            n++;
                            n = (n % BORDER_WIDTH_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BORDER_WIDTH_TOTAL_NUM;
                            g_borderWidthNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 7:  // 更改背景颜色
                            n = g_backgroundColorNo;
                            n++;
                            n = (n % BACKGROUND_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BACKGROUND_COLOR_TOTAL_NUM;
                            g_backgroundColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                    }

                }

                // 切换选择下降
                function changeSelectDown() { // g_changeTypeOnFuncMenu 指定切换内容：重排、颜色、线型

                    var n;
                    switch (g_changeTypeOnFuncMenu) {

                        case 1:  // 重排脑图
                            randSetBubblesAndResetALLBySavedData(1);   // 随机重排泡泡，并按照已保存的数据绘制全部
                            if (g_storyLine.trim() != "") {$("MENU_TEXT").innerHTML = "当前编号：" + g_arrangeNo + "/" + g_arrangeTotalNum;}
                            break;

                        case 2: // 更改脑图配色
                            n = g_colorSetNo;
                            n--;
                            n = (n < 0) ? (COLOR_SET_TOTAL_NUM - 1) : n;
                            n = (n % COLOR_SET_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + COLOR_SET_TOTAL_NUM;
                            g_colorSetNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 3:  // 更改颜色透明
                            n = g_colorOpacityNo;
                            n--;
                            n = (n < 0) ? (COLOR_OPACITY_TOTAL_NUM - 1) : n;
                            n = (n % COLOR_OPACITY_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + COLOR_OPACITY_TOTAL_NUM;
                            g_colorOpacityNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 4:  // 更改文字颜色
                            n = g_textColorNo;
                            n--;
                            n = (n < 0) ? (TEXT_COLOR_TOTAL_NUM - 1) : n;
                            n = (n % TEXT_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + TEXT_COLOR_TOTAL_NUM;
                            g_textColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 5:  // 更改边线颜色
                            n = g_borderColorNo;
                            n--;
                            n = (n < 0) ? (BORDER_COLOR_TOTAL_NUM - 1) : n;
                            n = (n % BORDER_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BORDER_COLOR_TOTAL_NUM;
                            g_borderColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 6:  // 更改边线宽度
                            n = g_borderWidthNo;
                            n--;
                            n = (n < 0) ? (BORDER_WIDTH_TOTAL_NUM - 1) : n;
                            n = (n % BORDER_WIDTH_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BORDER_WIDTH_TOTAL_NUM;
                            g_borderWidthNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                        case 7:  // 更改背景颜色
                            n = g_backgroundColorNo;
                            n--;
                            n = (n < 0) ? (BACKGROUND_COLOR_TOTAL_NUM - 1) : n;
                            n = (n % BACKGROUND_COLOR_TOTAL_NUM) + 1;
                            $("MENU_TEXT").innerHTML = "当前编号：" + n + "/" + BACKGROUND_COLOR_TOTAL_NUM;
                            g_backgroundColorNo = n - 1;
                            setAllBySavedData();    // 按照已保存的数据绘制全部
                            break;

                    }
                }

                // 确认选择
                function confirmSelect() {
                    closeMenuBox();
                    hideShowConfirm();
                    g_bubblesFixedOrRandom = "1";
                    saveAllData();
                    setAllBySavedData();    // 按照已保存的数据绘制全部
                }

                // 返回/取消，放弃选择
                function restorePrev() {
                    closeMenuBox();
                    hideShowConfirm();
                    readAllData();

                    switch (g_changeTypeOnFuncMenu) {
                        case 1:  // 重排脑图
                            break;

                        case 2: // 更改脑图配色
                            g_colorSetNo = g_restoreColorSetNo;
                            break;

                        case 3:  // 更改颜色透明
                            g_colorOpacityNo = g_restoreColorOpacityNo;
                            break;

                        case 4:  // 更改文字颜色
                            g_textColorNo = g_restoreTextColorNo;
                            break;

                        case 5:  // 更改边线颜色
                            g_borderColorNo = g_restoreBorderColorNo;
                            break;

                        case 6:  // 更改边线宽度
                            g_borderWidthNo = g_restoreBorderWidthNo;
                            break;

                        case 7:  // 更改背景颜色
                            g_backgroundColorNo = g_restoreBackgroundColorNo;
                            break;

                    }

                    readAllData();
                    setAllBySavedData();    // 按照已保存的数据绘制全部

                }

                // 确定清空脑图内容
                function confirmClean() {
                    closeMenuBox();
                    hideShowClean();
                    var i;
                    var BubbleText0Null = ["@", "", "", "", "", "", "", "", "", "", "", ""];
                    // 清空时，隐藏的要保持
                    for (i = 1; i < g_iParaID.length; i++) {
                        if (g_bubbleText0[i].indexOf("(hide)") != -1) { BubbleText0Null[i] = "(hide)"; }
                    }
                    var BubbleText1Null = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText2Null = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText3Null = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleText4Null = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubbleLinkNull = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BubblePicNull = ["", "", "", "", "", "", "", "", "", "", "", ""];
                    var BlockText0Null = ["", "", "", "", "", ""];
                    var BlockText1Null = ["", "", "", "", "", ""];
                    var BlockText2Null = ["", "", "", "", "", ""];
                    var BlockText3Null = ["", "", "", "", "", ""];
                    var BlockLinkNull = ["", "", "", "", "", ""];
                    var BlockPicNull = ["", "", "", "", "", ""];

                    // 数据是否保存过
                    g_bubblesFixedOrRandom = "1";

                    // 全息脑图标题数据，不清标题

                    // 概述
                    g_genWords = "";
                    processGenWords();

                    // 作者
                    g_authorDate = "";
                    $("AUTHOR_DATE").innerHTML = g_authorDate;

                    // 左标签
                    g_inMark = "";
                    $("IN_MARK").innerHTML = g_inMark;

                    // 右标签
                    g_outMark = "";
                    $("OUT_MARK").innerHTML = g_outMark;

                    // 各个内部序参量泡泡bubble的参数
                    g_bubbleText0 = BubbleText0Null;
                    g_bubbleText1 = BubbleText1Null;
                    g_bubbleText2 = BubbleText2Null;
                    g_bubbleText3 = BubbleText3Null;
                    g_bubbleText4 = BubbleText4Null;
                    g_bubbleLink = BubbleLinkNull;
                    g_bubblePic = BubblePicNull;

                    // 各个外部关联参量长方块block的参数
                    g_blockText0 = BlockText0Null;
                    g_blockText1 = BlockText1Null;
                    g_blockText2 = BlockText2Null;
                    g_blockText3 = BlockText3Null;
                    g_blockLink = BlockLinkNull;
                    g_blockPic = BlockPicNull;

                    saveAllData();
                    readAllData();
                    setAllBySavedData();    // 按照已保存的数据绘制全部

                }

                // 处理恢复编辑历史各个键
                // 恢复到原始点
                function restoreHistory2Start() {
                    restoreEditHistory2Point(0);
                }

                // 恢复到最新点
                function restoreHistory2End() {
                    restoreEditHistory2Point(EDIT_HISTORY_TATAL_NUM);
                }

                // 恢复到前一点
                function restoreHistory2Prev() {
                    g_editHistoryNo--;
                    if (g_editHistoryNo < 0) { g_editHistoryNo = 0; }
                    restoreEditHistory2Point(g_editHistoryNo);
                }

                // 恢复到后一点
                function restoreHistory2Next() {
                    g_editHistoryNo++;
                    if (g_editHistoryNo > EDIT_HISTORY_TATAL_NUM) { g_editHistoryNo = EDIT_HISTORY_TATAL_NUM; }
                    restoreEditHistory2Point(g_editHistoryNo);
                }

                // 快进恢复到前若干点
                function restoreHistory2PrevFast() {
                    g_editHistoryNo -= g_fastStep4Histroy;
                    if (g_editHistoryNo < 0) { g_editHistoryNo = 0; }
                    restoreEditHistory2Point(g_editHistoryNo);
                }

                // 快进恢复到后若干点
                function restoreHistory2NextFast() {
                    g_editHistoryNo += g_fastStep4Histroy;
                    if (g_editHistoryNo > EDIT_HISTORY_TATAL_NUM) { g_editHistoryNo = EDIT_HISTORY_TATAL_NUM; }
                    restoreEditHistory2Point(g_editHistoryNo);
                }

                // 确认恢复编辑历史
                function confirmRestoreHistory() {
                    closeMenuBox();
                    g_bubblesFixedOrRandom = "1";
                    saveAllData();
                    setAllBySavedData();    // 按照已保存的数据绘制全部

                }

                // 退出恢复编辑历史
                function closeRestoreHistory() {
                    closeMenuBox();
                    g_editHistoryNo = EDIT_HISTORY_TATAL_NUM;
                    restoreEditHistory2Point(g_editHistoryNo);
                }

                // 退出保存全息脑图
                function closeSave() {
                    hideShowSave();
                    closeMenuBox();
                }

                // 退出修改显示隐藏
                function closeHide() {
                    hideShowHide();
                    closeMenuBox();
                }

                // 退出显示基因
                function closeGene() {
                    hideShowGene();
                    closeMenuBox();
                }

                // 退出清空脑图内容
                function closeClean() {
                    hideShowClean();
                    closeMenuBox();
                }

                // 退出使用说明
                function closeManual() {
                    hideShowManual();
                    hideShowMenu();
                }

                // 确认修改显示隐藏
                function saveHide() {
                    hideShowHide();
                    var i, tID, tID2, strT, strT2, strT3;
                    for (i = 1; i < g_iParaID.length; i++) {
                        tID = "DIV_IN_" + i;
                        tID2 = "LN" + i;
                        strT = g_bubbleText0[i];
                        strT2 = "";

                        if ($("show_hide_" + i).checked == false) {
                            $(tID).style.display = "none";
                            // $(tID2).style.strokeWidth = "0";
                            $(tID2).style.display = "none";
                            // 标记(hide) 表示“隐藏该bubble”，缺省或为空时不隐藏
                            if (g_bubbleText0[i].indexOf("(hide)") == -1) { strT2 = "(hide)"; }
                            g_bubbleText0[i] = strT2 + strT.trim();
                        }
                        else {
                            $(tID).style.display = "block";
                            // $(tID2).style.strokeWidth = "1";
                            $(tID2).style.display = "block";
                            // 去掉标记(hide)
                            strT3 = g_bubbleText0[i];
                            g_bubbleText0[i] = strT3.replace("(hide)", "");
                        }
                    } // for end

                    saveAllData(); // 保存全部数据到数据区
                    setAllBySavedData();
                    g_tmpBubbleClicked = 0;   // 鼠标悬浮高亮恢复
                }

                // 在新建脑图和显示示例时，强制显示所有泡泡
                function showAllBubblesMust() {
                    var i, tID, tID2;
                    for (i = 0; i < g_iParaID.length; i++) {
                        tID = "DIV_IN_" + i;
                        tID2 = "LN" + i;
                        $(tID).style.display = "block";
                        $(tID2).style.display = "block";
                    }
                }

                // 全选或全不选隐藏
                function selectHideAllNone(s) {
                    var i;
                    if (s == 1)   // 全选
                    {
                        for (i = 1; i < g_iParaID.length; i++) {
                            $("show_hide_" + i).checked = true;
                        }
                    }
                    else {
                        for (i = 1; i < g_iParaID.length; i++) {
                            $("show_hide_" + i).checked = false;
                        }
                    }
                }



                // ***********************************************************************************************************************************
                // ******************************************************** 功能菜单处理结束 ***********************************************************
                // ***********************************************************************************************************************************


                // ********************************************************** startEdit ****************************************************************
                // 开始编辑脑图
                function startEdit() {

                    g_currentHighLightNo = -1;    // 回到初始，避免中间改动，否则高亮不动
                    hideShowWelcomeCover();
                    hideShowWelcomeBox();

                }


                // ******************************************************** showStartPage **************************************************************
                // 显示封面——初始界面（欢迎页面）
                function showStartPage() {

                    closeAllBoxes();
                    $("WELCOME_COVER").style.display = "block";
                    $("SHOW_WELCOME_BOX").style.display = "block";
                    $("MENU_CHAR").innerHTML = "≚";
                    $("ENTER_FULL_SCREEN").style.display = "block";
                    $("CANCEL_FULL_SCREEN").style.display = "none";

                }


                // *********************************************************** quitAHMM ****************************************************************
                // 退出脑图
                function quitAHMM() {

                    g_fileModified = 0;   // 设置为0，避免监听beforeunload再次提示

                    window.opener = null;
                    window.open("about:blank", "_self");
                    window.close();
                }


                // ******************************************************** quitAHMMWithConfirm ********************************************************
                // 确认后退出脑图。如果没有修改过，不提示直接退出
                function quitAHMMWithConfirm() {

                    if (g_fileModified == 1 || g_inMobileMode) {   // 移动设备播放时，为了防止误碰屏幕，需要确认一下
                        $("CONFIRM_QUIT").style.display = "block";
                    } else {
                        quitAHMM();
                    }
                    closeMenuBox();
                    if (g_inMobileMode) { $("CONFIRM_QUIT").style.transform = "scale(2)"; }  // 移动设备上放大显示

                }


                // ************************************************************ reloadAHMM *************************************************************
                // 重载脑图
                function reloadAHMM() {
                    location.reload();
                }


                // ***************************************************** reloadAHMMWithConfirm *********************************************************
                // 确认后重新打开当前脑图。仅移动设备上使用。移动设备触屏左上角容易误碰，需确认
                function reloadAHMMWithConfirm() {

                    $("CONFIRM_RELOAD").style.display = "block";
                    if (g_inMobileMode) { $("CONFIRM_RELOAD").style.transform = "scale(2)"; }  // 移动设备上放大显示

                }


                // ********************************************************** closeAllBoxes ************************************************************
                // 关掉所有交互窗口
                function closeAllBoxes() {

                    hideEditInnerPara();
                    hideEditOuterPara();
                    hideEditLogo();
                    hideEditBackPicMusic();
                    hideEditTitle();
                    hideUpdate();
                    hideUpdateAhmmFileFinish();
                    hideAIAhmmFileFinish();
                    hideConfirmQuit();
                    hideEditAuthor();
                    hideEditInMark();
                    hideEditOutMark();
                    hideEditGenWords();
                    hideShowMenu();
                    hideShowConfirm();
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowManual();
                    hideShowHide();
                    hideShowGene();
                    hideShowWelcomeCover();
                    hideShowWelcomeBox();
                    hideDivDirFrame();
                    hideOperateDirFrame();
                    hideConfirmQuit();
                    hideConfirmReload();
                    $("CLICK_LEFT").style.opacity = "0";
                    $("CLICK_RIGHT").style.opacity = "0";

                }


                // ******************************************************** closeAllEditBoxes **********************************************************
                // 显示下拉功能菜单时，关掉所有编辑交互窗口
                function closeAllEditBoxes() {

                    hideEditInnerPara();
                    hideEditOuterPara();
                    hideEditLogo();
                    hideEditBackPicMusic();
                    hideEditTitle();
                    hideUpdate();
                    hideUpdateAhmmFileFinish();
                    hideAIAhmmFileFinish();
                    hideConfirmQuit();
                    hideEditAuthor();
                    hideEditInMark();
                    hideEditOutMark();
                    hideEditGenWords();

                    hideShowWelcomeCover();
                    hideShowWelcomeBox();
                    hideDivDirFrame();
                    hideOperateDirFrame();
                    hideConfirmQuit();
                    hideConfirmReload();
                    hideShowManual();
                    $("CLICK_LEFT").style.opacity = "0";
                    $("CLICK_RIGHT").style.opacity = "0";

                }


                // ******************************************************** closeAllMenuBoxes **********************************************************
                // 关掉所有交互窗口
                function closeAllMenuBoxes() {

                    hideShowMenu();
                    hideShowConfirm();
                    hideShowHide();
                    hideShowGene();
                    hideShowSave();
                    hideShowRestore();
                    hideShowClean();
                    hideShowManual();
                    hideShowWelcomeCover();
                    hideShowWelcomeBox();
                    hideDivDirFrame();
                    hideOperateDirFrame();
                    hideConfirmQuit();
                    hideConfirmReload();
                    $("CLICK_LEFT").style.opacity = "0";
                    $("CLICK_RIGHT").style.opacity = "0";

                }


                // ********************************************************** showGuideInfo ************************************************************
                // 显示操作向导窗口
                function showGuideInfo() {

                    $("GUIDE_INFO_BOX").style.display = "block";

                }


                // ********************************************************* 隐藏各个编辑窗口 **********************************************************
                function hideEditInnerPara() {
                    $("EDIT_INNER_PARA_BOX").style.display = "none";
                    g_tmpBubbleClicked = 0;    // 恢复鼠标悬浮高亮
                }

                function hideEditOuterPara() {
                    $("EDIT_OUTER_PARA_BOX").style.display = "none";
                    g_tmpBlockClicked = 0;    // 恢复鼠标悬浮高亮
                }

                function hideEditLogo() {
                    $("EDIT_LOGO_BOX").style.display = "none";
                }

                function hideEditBackPicMusic() {
                    $("EDIT_BACK_PIC_MUSIC_BOX").style.display = "none";
                }

                function hideEditTitle() {
                    $("EDIT_TITLE_BOX").style.display = "none";
                }

                function hideUpdate() {
                    g_htmlText = "";
                    $("old_file").value = "";
                    $("UPDATE_AHMM_FILE").style.display = "none";
                }

                function hideUpdateAhmmFileFinish() {
                    $('UPDATE_AHMM_FILE_FINISH').style.display = 'none';
                }

                function hideAIAhmmFileFinish() {
                    $('AI_AHMM_FILE_FINISH').style.display = 'none';
                }

                function hideConfirmQuit() {
                    $('CONFIRM_QUIT').style.display = 'none';
                }

                function hideConfirmReload() {
                    $('CONFIRM_RELOAD').style.display = 'none';
                }
                function hideEditAuthor() {
                    $("EDIT_AUTHOR_BOX").style.display = "none";
                }

                function hideEditInMark() {
                    $("EDIT_IN_MARK_BOX").style.display = "none";
                }

                function hideEditOutMark() {
                    $("EDIT_OUT_MARK_BOX").style.display = "none";
                }

                function hideEditGenWords() {
                    $("EDIT_GEN_WORDS_BOX").style.display = "none";
                }

                function hideShowMenu() {
                    $("FUNCTION_MENU_BOX").style.display = "none";
                    $("MENU_CHAR").innerHTML = "≚";
                    $("FUNCTION_MENU_BOX_ARROW").style.display = "none";
                }

                function hideShowConfirm() {
                    $("FUNCTION_CONFIRM_BOX").style.display = "none";
                }

                function hideShowSave() {
                    $("SHOW_SAVE_BOX").style.display = "none";
                }

                function hideShowRestore() {
                    $("SHOW_RESTORE_BOX").style.display = "none";
                }

                function hideShowClean() {
                    $("SHOW_CLEAN_BOX").style.display = "none";
                }

                function hideShowManual() {
                    $("SHOW_MANUAL_BOX").style.display = "none";
                }

                function hideShowWelcomeCover() {
                    $("WELCOME_COVER").style.display = "none";
                }

                function hideShowWelcomeBox() {
                    $("SHOW_WELCOME_BOX").style.display = "none";
                }

                function hideShowGuideInfo() {
                    $("GUIDE_INFO_BOX").style.display = "none";
                }

                function hideShowHide() {
                    $("SHOW_HIDE_BOX").style.display = "none";
                }


                function hideShowGene() {
                    $("SHOW_GENE_BOX").style.display = "none";
                }

                function hideDivDirFrame() {
                    $("DIV_INNER_FRAME").style.display = "none";
                }

                function hideOperateDirFrame() {
                    $("OPERATE_INNER_FRAME").style.display = "none";
                    $("CLOSE_INNER_LINK2").style.display = "none";
                }


                // ************************************************************ getFocus ***************************************************************
                // input 框获取焦点
                function getFocus(id) {

                    $(id).focus();

                }


                // ******************************************************* markCurrentBubble ***********************************************************
                // 编辑时，标记当前泡泡
                function markCurrentBubble() {

                    var tmpID = 'CR_' + g_currentBubbleID + '_2';
                    var selfScale = parseFloat(g_bubbleScale[g_currentBubbleID]);  // selfScale 为单个bubble的缩放比例， /selfScale 消除高亮时边线变粗

                    setAttr(tmpID, "stroke", "#FF5500");
                    setAttr(tmpID, "stroke-width", 15 / selfScale + "");
                    setAttr(tmpID, "stroke-dasharray", 5 / selfScale + ", " + 3 / selfScale);

                }


                // ******************************************************** markCurrentBlock ***********************************************************
                // 编辑时，标记当前块块
                function markCurrentBlock() {

                    var tmpID = 'RT_' + g_currentBlockID + '_2';
                    setAttr(tmpID, "stroke", "#FF5500");
                    setAttr(tmpID, "stroke-width", "15");
                    setAttr(tmpID, "stroke-dasharray", "5, 3");

                }


                // ******************************************************** highLightBubble ************************************************************
                // 鼠标移动其上时，标记当前泡泡
                function highLightBubble(no) {
                    if (g_tmpBubbleClicked == 0) {   // 当没有单击时，启动高亮

                        g_currentHighLightNo = no + 1;    // 记录当前高亮位置，下次调用nextItem()等时从这里开始
                        g_keepHighLight = false;
                        deHighLightAll();

                        $("DIV_IN_" + no).style.display = "block";

                        var selfScale = parseFloat(g_bubbleScale[no]);   // selfScale 为单个bubble的缩放比例， /selfScale 消除高亮时边线变粗

                        // 处理高亮
                        if (g_inFullScreen) {
                            // 播放时显示彩虹圈
                            $("CR_" + no + "_3").style.display = "block";
                        } else {
                            // 编辑时显示橙色虚线圈
                            var tmpID = 'CR_' + no + '_2';
                            setAttr(tmpID, "stroke", "#FF5500");
                            setAttr(tmpID, "stroke-width", 15 / selfScale + "");
                            setAttr(tmpID, "stroke-dasharray", 5 / selfScale + ", " + 3 / selfScale);
                        }

                        if (g_colorOpacity[g_colorOpacityNo] < 1.0) {   // 如果配色是透明的，则不显示连线
                            $("LN" + no).style.display = "none";
                        }
                        else {
                            $("LN" + no).style.display = "block";
                        }
                        
                        // 放大显示，仅在播放时
                        if (g_inFullScreen) {
                            var scale = 2 * selfScale;
                            tmpID = "DIV_IN_" + no;
                            $(tmpID).style.transform = `scale(${scale})`;
                            g_zIndexBeforeScale = $(tmpID).style.zIndex;   // 记录原来的
                            $(tmpID).style.zIndex = g_zIndexAfterScale++;  // 置顶
                        }
                    }
                    g_highLightShowing = true;

                }


                // ******************************************************* deHighLightBubble ***********************************************************
                // 鼠标移动离开其上时，去除标记当前泡泡
                function deHighLightBubble(no) {
                    if (g_keepHighLight) { highLightBubble(no); return undefined; }   // 当调外部网页、显示本地目录时，因鼠标移动，deHighLight...会执行，导致返回脑图页面时高亮消失，需要标记，强制高亮

                    if (g_tmpBubbleClicked == 0) {   // 当没有单击时，去掉高亮，恢复原态
                        var tmpID = 'CR_' + no + '_2';
                        g_tmpValue = g_borderColor[g_borderColorNo];
                        if (g_tmpValue == "MULTI-COLOR1") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 1][no]; }  // 多彩色模式使用泡泡的彩色填充色
                        if (g_tmpValue == "MULTI-COLOR2") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 2][no]; }
                        setAttr(tmpID, "stroke", g_tmpValue);
                        g_tmpValue = (g_borderUsed == 0) ? 0 : g_borderWidth[g_borderWidthNo];
                        setAttr(tmpID, "stroke-width", g_tmpValue);
                        g_tmpValue = g_colorOpacity[g_colorOpacityNo];
                        setAttr(tmpID, "opacity", g_tmpValue);
                        setAttr(tmpID, "stroke-dasharray", "1, 0");

                        // 缩回原来大小
                        var scale = g_bubbleScale[no];
                        tmpID = "DIV_IN_" + no;
                        $(tmpID).style.transform = `scale(${scale})`;

                        // 隐藏彩虹圈
                        $("CR_" + no + "_3").style.display = "none";
                        

                        // 恢复 zIndex
                        // 只有在全屏播放时恢复
                        if (g_inFullScreen) {
                            // 只有在【不是取消所有高亮】时才恢复。
                            // 如果在调用 deHighLightAll() 取消所有高亮时都处理 zIndex，则会把泡泡原有的遮挡关系破坏，
                            // 所以，在取消所有高亮操作时，不处理 zIndex
                            if (!g_inDeHighLightAll) { $(tmpID).style.zIndex = g_zIndexBeforeScale; }
                        }
                    }

                    g_highLightShowing = false;

                }


                // ******************************************************** highLightBlock *************************************************************
                // 鼠标移动其上时，标记当前块块
                function highLightBlock(no) {

                    if (g_tmpBlockClicked == 0) {   // 当没有单击时，启动高亮
                        
                        g_currentHighLightNo = no + 12;    // 记录当前高亮位置，下次调用nextItem()等时从这里开始
                        g_keepHighLight = false;
                        deHighLightAll();

                        $("DIV_OUT_" + no).style.display = "block";

                        // 处理高亮
                        if (g_inFullScreen) {
                            // 播放时显示彩虹框
                            $("RT_" + no + "_3").style.display = "block";
                        } else {
                            // 编辑时显示橙色虚线框
                            var tmpID = 'RT_' + no + '_2';
                            setAttr(tmpID, "stroke", "#FF5500");
                            setAttr(tmpID, "stroke-width", "15");
                            setAttr(tmpID, "stroke-dasharray", "5, 3");
                        }

                        // block上的链接不包含在block的<g>里，需要单独处理
                        if (g_blockLink[no] != "") {
                            $("O_P" + no + "_LM").style.display = "inline";
                        } else {
                            $("O_P" + no + "_LM").style.display = "none";
                        }

                        // 放大显示，仅在播放时
                        if (g_inFullScreen) {
                            var scale = 1.2;
                            tmpID = "DIV_OUT_" + no;
                            $(tmpID).style.transform = `scale(${scale})`;
                            $(tmpID).style.transformOrigin = "right bottom";   // 放大时，原点在左上角 
                            g_zIndexBeforeScale = $(tmpID).style.zIndex;   // 记录原来的
                            $(tmpID).style.zIndex = g_zIndexAfterScale++;  // 置顶
                        }

                    }
                    g_highLightShowing = true;

                }


                // ******************************************************* deHighLightBlock ************************************************************
                // 鼠标移动离开其上时，去除标记当前块块
                function deHighLightBlock(no) {

                    if (g_keepHighLight) { highLightBlock(no); return undefined; }   // 当调外部网页、显示本地目录时，因鼠标移动，deHighLight...会执行，导致返回脑图页面时高亮消失，需要标记，强制高亮

                    if (g_tmpBlockClicked == 0) {   // 当没有单击时，去掉高亮，恢复原态
                        var tmpID = 'RT_' + no + '_2';

                        g_tmpValue = g_borderColor[g_borderColorNo];
                        if (g_tmpValue == "MULTI-COLOR1") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 1][(no - 1) * 2 + 1]; }  // 多彩色模式使用泡泡的彩色填充色
                        if (g_tmpValue == "MULTI-COLOR2") { g_tmpValue = g_bubbleColor[COLOR_SET_TOTAL_NUM - 2][(no - 1) * 2 + 1]; }
                        setAttr(tmpID, "stroke", g_tmpValue);
                        g_tmpValue = (g_borderUsed == 0) ? 0 : g_borderWidth[g_borderWidthNo];
                        setAttr(tmpID, "stroke-width", g_tmpValue);
                        g_tmpValue = g_colorOpacity[g_colorOpacityNo];
                        setAttr(tmpID, "opacity", g_tmpValue);
                        setAttr(tmpID, "stroke-dasharray", "1, 0");

                        // 缩回原来大小
                        var scale = 1;
                        tmpID = "DIV_OUT_" + no;
                        $(tmpID).style.transform = `scale(${scale})`;

                        // 隐藏彩虹圈
                        $("RT_" + no + "_3").style.display = "none";
                        
                        // 恢复 zIndex
                        // 只有在全屏播放时恢复
                        if (g_inFullScreen) {
                            // 恢复到所有泡泡之下
                            if (!g_inDeHighLightAll) { $(tmpID).style.zIndex = 1;  
                            }
                        }

                    }

                    g_highLightShowing = false;

                }


                // ******************************************************** highLightGenWords **********************************************************
                // 鼠标移动其上时，标记概述
                function highLightGenWords() {
                    
                    g_currentHighLightNo = 0;    // 记录当前高亮位置，下次调用nextItem()等时从这里开始
                    g_keepHighLight = false;
                    deHighLightAll();

                    $("GEN_WORDS_BOX").style.display = 'block';

                    // 处理高亮
                    if (g_inFullScreen) {
                        // 播放时显示彩虹框
                        $("GEN_WORDS_BOX").classList.add('gen_words-dynamic-rainbow');
                        $("GEN_WORDS_BOX").style.border = '20px solid #FF5500';
                    } else {
                        // 编辑时显示橙色虚线框
                        $("GEN_WORDS_BOX").style.border = '15px dashed #FF5500';
                        $("GEN_WORDS_BOX").style.paddingLeft = '5px';
                        $("GEN_WORDS_BOX").style.paddingRight = '5px';
                        $("GEN_WORDS_BOX").style.paddingTop = '5px';
                        $("GEN_WORDS_BOX").style.paddingBottom = '5px';
                        $('GEN_WORDS_TEXT2').style.left = '1145px';
                        $('GEN_WORDS_TEXT2').style.top = '-15px';
                    }

                    // 放大显示，仅在播放时
                    if (g_inFullScreen) {
                            var scale = 1.2;
                            tmpID = "GEN_WORDS_BOX";
                            $(tmpID).style.transform = `scale(${scale})`;
                            g_zIndexBeforeScale = $(tmpID).style.zIndex;   // 记录原来的
                            $(tmpID).style.zIndex = g_zIndexAfterScale++;  // 置顶
                        }

                }

                // ****************************************************** deHighLightGenWords **********************************************************
                // 鼠标移动离开其上时，去除标记概述
                function deHighLightGenWords() {

                    if (g_keepHighLight) { return undefined; }   // 当调外部网页、显示本地目录时，因鼠标移动，deHighLight...会执行，导致返回脑图页面时高亮消失，需要标记，强制高亮

                    $("GEN_WORDS_BOX").style.border = '1px none #AAAAAA';
                    $("GEN_WORDS_BOX").style.paddingLeft = '20px';
                    $("GEN_WORDS_BOX").style.paddingRight = '20px';
                    $("GEN_WORDS_BOX").style.paddingTop = '20px';
                    $("GEN_WORDS_BOX").style.paddingBottom = '20px';
                    $('GEN_WORDS_TEXT2').style.left = '1160px';
                    $('GEN_WORDS_TEXT2').style.top = '0px';

                    // 移除彩虹边框效果
                    $("GEN_WORDS_BOX").classList.remove('gen_words-dynamic-rainbow');

                    // 缩回原来大小
                    $("GEN_WORDS_BOX").style.transform = `scale(1)`;

                }


                // ******************************************************** highLightCurrent ***********************************************************
                // 按照 g_currentHighLightNo高亮当前的。概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17。
                // 暂未用，保留
                function highLightCurrent() {

                    g_keepHighLight = false;
                    deHighLightAll();
                    if (g_currentHighLightNo == 0) { highLightGenWords(); }
                    if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) { highLightBubble(g_currentHighLightNo - 1); }
                    if (g_currentHighLightNo >= 13) { highLightBlock(g_currentHighLightNo - 12); }

                }


                // ********************************************************* deHighLightPrev ***********************************************************
                // 去掉前一个高亮，仅被 prevItem()和nextItem()调用
                function deHighLightPrev() {

                    // g_currentHighLightNo 标记当前哪个图元是高亮，包括概述=,0、泡泡=1~12，和块块13~17。
                    // 在本function执行过程中，它的值会改变，因此事先保存，最后再恢复。
                    let tmp_for_g_currentHighLightNo = g_currentHighLightNo;

                    // 去掉响应高亮
                    if (g_deCurrentHighLightNo == 0) { deHighLightGenWords(); }
                    if (g_deCurrentHighLightNo >= 1 && g_deCurrentHighLightNo <= 12) { deHighLightBubble(g_deCurrentHighLightNo - 1); }
                    if (g_deCurrentHighLightNo >= 13) { deHighLightBlock(g_deCurrentHighLightNo - 12); }

                    // 恢复g_currentHighLightNo 的值
                    g_currentHighLightNo = tmp_for_g_currentHighLightNo;
                    
                }


                // ********************************************************** deHighLightAll ***********************************************************
                // 去掉所有高亮，打开本文件时执行。目的是防止在保存的时候，高亮被保存，再次打开文件时高亮仍在
                function deHighLightAll() {

                    // 取消概述高亮
                    deHighLightGenWords();

                    // 取消各个泡泡高亮
                    // 标记正在执行 function deHighLightAll()。在 function deHighLightBubble()中，如果为 true，则不处理泡泡的 zIndex，保持遮挡关系不变。
                    g_inDeHighLightAll = true; 
                    // 取消所有泡泡高亮   
                    for (let i = 0; i <= 11; i++) {
                        deHighLightBubble(i);
                    }
                    // 恢复 g_inDeHighLightAll 值
                    g_inDeHighLightAll = false;


                    for (let i = 1; i <= 5; i++) {
                        deHighLightBlock(i);
                    }

                }


                // *************************************************************************************************************************************
                // *************************************************** 以下处理泡泡拖动、单击、置顶 *******************************************************
                // ******************** 此部分代码实际上是主程序，因为处理这些系统级的基本操作比较麻烦，不可用function写，否则容易出问题 ***********************
                // *************************************************************************************************************************************

                // *************************************************** 拖动/单击 **************************************************************
                var elIsMove = false; // 定义是否移动过的状态，全局变量
                var rDragBubble = {
                    o: null,

                    init: function (o) {
                        o.onmousedown = this.start;
                        o.onclick = this.clk;
                    },

                    start: function (e) {
                        g_inDrag = 0;
                        g_currentDIV = this.id;
                        this.style.zIndex = g_zIndexBubble++;
                        var o;
                        e = rDragBubble.fixEvent(e);
                        e.preventDefault && e.preventDefault();
                        rDragBubble.o = o = this;
                        o.x = e.clientX - rDragBubble.o.offsetLeft;
                        o.y = e.clientY - rDragBubble.o.offsetTop;
                        document.onmousemove = rDragBubble.move;
                        document.onmouseup = rDragBubble.end;

                        var tStr = g_currentDIV;
                        var bubbleId = parseInt(tStr.replace(/DIV_IN_/, ""));
                        highLightBubble(bubbleId);

                    },

                    // 移动
                    move: function (e) {
                        hideShowGuideInfo();   // 隐藏操作向导
                        e = rDragBubble.fixEvent(e);
                        var oLeft, oTop, oWidth, oHeight;
                        oWidth = parseInt($(g_currentDIV).style.width);
                        oHeight = parseInt($(g_currentDIV).style.height);
                        oLeft = e.clientX - rDragBubble.o.x;
                        oTop = e.clientY - rDragBubble.o.y;
                        if ((Math.abs(parseInt(rDragBubble.o.style.left) - oLeft) > 3) || (Math.abs(parseInt(rDragBubble.o.style.top) - oTop) > 3)) {
                            // 下2行代码限定泡泡可移动范围在中部绘图区，不可超出
                            // if (oLeft > 100 && oLeft < 1400 - oWidth) { rDragBubble.o.style.left = oLeft + 'px'; }
                            // if (oTop > 400 && oTop < 1050 - oHeight) { rDragBubble.o.style.top = oTop + 'px'; }

                            // 下2行代码不限定泡泡可移动范围，可以超出中部绘图区
                            if (oLeft > -200 && oLeft < 2200 - oWidth) { rDragBubble.o.style.left = oLeft + 'px'; }
                            if (oTop > -200 && oTop < 1400 - oHeight) { rDragBubble.o.style.top = oTop + 'px'; }

                            // 隐藏连接线
                            var tStr = g_currentDIV;
                            var bubbleId = parseInt(tStr.replace(/DIV_IN_/, ""));
                            var g_tmpID = "LN" + bubbleId;

                            if (g_storyLine.trim() != "") {   // 故事线模式，隐藏2根线
                                $(g_tmpID).style.display = "none";   // 隐藏从前面小号码的泡泡连接自己的线
                                // 隐藏下一根线，这根线的编号是下一个显示的泡泡的ID
                                // 找到下一个显示的泡泡
                                var lastShowBubbleID = 0;   // 最后一个显示的泡泡的ID
                                lastShowBubbleID = 0;
                                for (let ii = 0; ii <=11; ii++) {
                                    if (g_bubbleText0[ii].toLowerCase().indexOf("(hide)") == -1) {
                                        lastShowBubbleID = ii;
                                    }
                                }

                                if (bubbleId <=lastShowBubbleID -1) {
                                    while (g_bubbleText0[bubbleId + 1].toLowerCase().indexOf("(hide)") != -1) {
                                        bubbleId ++;
                                    } 
                                    g_tmpID = "LN" + (bubbleId + 1);   // 下一个显示的泡泡
                                    $(g_tmpID).style.display = "none"; 
                                }

                            } else {  // 星形模式，隐藏连接自己的1条线，吸引子隐藏所有线
                                if (bubbleId != 0) {  // 不是吸引子
                                    $(g_tmpID).style.display = "none";
                                } else {   // 是吸引子
                                    for (let i = 1; i <= 11; i++) {
                                        $("LN" + i).style.display = "none";
                                    }
                                }
                            }
                            
                            g_inDrag = 1;
                            elIsMove = true;    // 在元素移动的时候改变状态

                        }
                    },

                    end: function (e) {
                        e = rDragBubble.fixEvent(e);
                        rDragBubble.o = document.onmousemove = document.onmouseup = null;
                        freshData();
                    },

                    // click事件，单击
                    clk: function (e) {
                        if (elIsMove) {
                            elIsMove = false;    // 如果状态是true，则证明元素被移动过，不触发click调用的方法
                            return;
                        }
                        else {   // 如果是单击. click
                            hideShowGuideInfo();   // 隐藏操作向导
                            var bubbleId, bubbleId2;
                            var tStr, lk_url;
                            tStr = g_currentDIV;
                            bubbleId = parseInt(tStr.replace(/DIV_IN_/, ""));
                            if (bubbleId == 0) {
                                bubbleId2 = "SYS_ATTRACTOR";
                            }
                            else {
                                bubbleId2 = "INNER_PARA_" + bubbleId;
                            }
                            lk_url = g_bubbleLink[bubbleId];
                            if (lk_url.trim() != "") {
                                $(bubbleId2).setAttribute("style", "cursor:pointer;");
                                if ($("I_P" + bubbleId + "_T5_2").style.fillOpacity != "100") { openFirstInnerLink(lk_url); }   // 当 ... 没有高亮时，打开链接。否则，编辑会打开链接
                            }
                            else {
                                $(bubbleId2).setAttribute("style", "cursor:default;");
                                $(bubbleId2).setAttribute("onclick", "");
                            }
                            return;
                        }
                    },

                    fixEvent: function (e) {
                        if (!e) {
                            e = window.event;   // <!-- 不修改 -->
                            e.target = e.srcElement;
                            e.layerX = e.offsetX;
                            e.layerY = e.offsetY;
                        }
                        return e;
                    }

                }   // var rDragBubble 结束

                // ****************************************************** 拖动/单击结束 *******************************************************


                // ********************************************************* 点击置顶 *********************************************************
                var rSetTop = {
                    o: null,

                    init: function (o) {
                        o.onmousedown = this.start;
                    },

                    start: function (e) {
                        g_inDrag = 0;
                        g_currentDIV = this.id;
                        this.style.zIndex = g_zIndexBox++;

                        var tStr = g_currentDIV;
                        var bubbleId = parseInt(tStr.replace(/DIV_IN_/, ""));
                        if (!isNaN(bubbleId)) { highLightBubble(bubbleId); }   // 如果不是数字，说明它不是bubble，则不高亮

                    },

                    move: function (e) {
                        g_inDrag = 1;
                        e = rSetTop.fixEvent(e);
                        var oLeft, oTop;
                        oLeft = e.clientX - rSetTop.o.x;
                        oTop = e.clientY - rSetTop.o.y;
                        rSetTop.o.style.left = oLeft + 'px';
                        rSetTop.o.style.top = oTop + 'px';
                    },

                    end: function (e) {
                        e = rSetTop.fixEvent(e);
                        rSetTop.o = document.onmousemove = document.onmouseup = null;
                        freshData();
                    },

                    fixEvent: function (e) {
                        if (!e) {
                            e = window.event;   // <!-- 不修改 -->
                            e.target = e.srcElement;
                            e.layerX = e.offsetX;
                            e.layerY = e.offsetY;
                        }
                        return e;
                    }
                }  // var rSetTop 结束


                // 点击时置顶
                var obj1 = $('EDIT_INNER_PARA_BOX');
                rSetTop.init(obj1);
                var obj2 = $('EDIT_OUTER_PARA_BOX');
                rSetTop.init(obj2);
                var obj3 = $('EDIT_TITLE_BOX');
                rSetTop.init(obj3);
                var obj4 = $('EDIT_AUTHOR_BOX');
                rSetTop.init(obj4);
                var obj5 = $('EDIT_GEN_WORDS_BOX');
                rSetTop.init(obj5);
                var obj6 = $('SHOW_WELCOME_BOX');
                rSetTop.init(obj6);
                var obj7 = $('SHOW_SAVE_BOX');
                rSetTop.init(obj7);
                var obj8 = $('SHOW_MANUAL_BOX');
                rSetTop.init(obj8);
                var obj9 = $('EDIT_LOGO_BOX');
                rSetTop.init(obj9);
                var obj10 = $('EDIT_IN_MARK_BOX');
                rSetTop.init(obj10);
                var obj11 = $('EDIT_OUT_MARK_BOX');
                rSetTop.init(obj11);
                var obj12 = $('FUNCTION_MENU_BOX');
                rSetTop.init(obj12);
                var obj13 = $('FUNCTION_CONFIRM_BOX');
                rSetTop.init(obj13);
                var obj14 = $('SHOW_HIDE_BOX');
                rSetTop.init(obj14);
                var obj15 = $('SHOW_GENE_BOX');
                rSetTop.init(obj15);

                var obj30 = $('DIV_IN_0');
                rDragBubble.init(obj30);
                var obj31 = $('DIV_IN_1');
                rDragBubble.init(obj31);
                var obj32 = $('DIV_IN_2');
                rDragBubble.init(obj32);
                var obj33 = $('DIV_IN_3');
                rDragBubble.init(obj33);
                var obj34 = $('DIV_IN_4');
                rDragBubble.init(obj34);
                var obj35 = $('DIV_IN_5');
                rDragBubble.init(obj35);
                var obj36 = $('DIV_IN_6');
                rDragBubble.init(obj36);
                var obj37 = $('DIV_IN_7');
                rDragBubble.init(obj37);
                var obj38 = $('DIV_IN_8');
                rDragBubble.init(obj38);
                var obj39 = $('DIV_IN_9');
                rDragBubble.init(obj39);
                var obj40 = $('DIV_IN_10');
                rDragBubble.init(obj40);
                var obj41 = $('DIV_IN_11');
                rDragBubble.init(obj41);

                // ****************************************************** 点击置顶结束 ********************************************************


                // ******************************************************* freshData *********************************************************
                // 刷新泡泡被移动后的数据
                function freshData() {

                    var s, x, y;
                    var bubbleId;
                    var tStr;

                    tStr = g_currentDIV;
                    bubbleId = parseInt(tStr.replace(/DIV_IN_/, ""));
                    x = g_bubbleX[bubbleId];
                    y = g_bubbleY[bubbleId];

                    r = 0.1;

                    // 设置星形模式或故事线模式时泡泡大小的比例
                    s = g_bubbleScl[bubbleId];   // 默认是星形模式，各个泡泡大小不同
                    if (g_storyLine.trim() != "") {s =SCALE_FOR_STORY_MODE;}

                    // 计算各个泡泡的位置
                    iLocR = g_leftWidth * r * s * g_r_Scale;
                    iLocX = parseInt($(g_currentDIV).style.left);
                    iLocY = parseInt($(g_currentDIV).style.top);
                    g_bubbleX[bubbleId] = (iLocX - X_OFFSET + iLocR + INNER_OFFSET - 80) / g_leftWidth;
                    g_bubbleY[bubbleId] = (iLocY - Y_OFFSET + iLocR + INNER_OFFSET - Y_TOPIC_HEIGHT) / g_mainHeight;

                    g_bubblesFixedOrRandom = "1";

                    // 全屏播放状态下，如果移动过泡泡，视为演示动作，不是编辑，所以关闭脑图时不提示保存。但DATA_SAVER中已更改，需要保存，否则会显示有问题。
                    // 在全屏播放状态下，移动过之后：如果CtrlS保存了，则下次打开时会按照移动过的位置摆放；如果没有CtrlS，则下次打开会按照移动前的位置摆放
                    if (elIsMove) {
                        let t = g_fileModified;   // 记录此前是否修改过
                        saveAllData();           // saveAllData()会将 g_fileModified = 1
                        setAllBySavedData();    // 按照已保存的数据DATA_SAVER绘制全部
                        if (!elIsMove || g_inFullScreen) { g_fileModified = t; }    // 恢复saveAllData()前的值
                    }

                }

                // *************************************************************************************************************************************
                // ************************************************** 以上处理泡泡拖动、单击、置顶结束*****************************************************
                // *************************************************************************************************************************************



                // ********************************************************** setAttr ******************************************************************
                // 设置html要素的属性。例如：$("mycircle").setAttribute("r",r);
                function setAttr(elemId, elemAttr, value) {

                    var e = elemId.trim();
                    var a = elemAttr.trim();

                    $(e).setAttribute(a, value);

                }


                // ********************************************************* getUrlParam ***************************************************************
                // 获取html命令行参数： <a href="b.html?id=1&name=abc">带参数URL</a> ，调用方法：name = getUrlParam("name");
                function getUrlParam(name) {
                    // 获取当前页面的URL
                    const url = window.location.href;

                    // 解析URL的查询字符串部分（即?后面的部分）
                    const queryParams = new URLSearchParams(url.split('?')[1] || '');

                    // 使用URLSearchParams的get方法获取参数值
                    const value = queryParams.get(name);

                    // 如果value为null，则返回空字符串，否则返回value
                    return value === null ? "" : value;
                }


                // ******************************************************* getHTMLSelfName *************************************************************
                // 获取本HTML文件名
                function getHTMLSelfName() {

                    let fileName = location.pathname.split("/").reverse()[0];
                    return fileName;

                }


                // ********************************************************* getLinkFile ***************************************************************
                // 打开本地文件夹，获得文件名，用于填入链接信息
                function getLinkFile(u, d, value) {

                    // 获取文本框dom
                    var doc = $(d);
                    // 获取上传控件dom
                    var upload = $(u);
                    // 获取文件名
                    var fileName = upload.files[0].name;
                    // 获取文件路径
                    var filePath = upload.value;
                    // 将文件名载入文本框
                    doc.value = fileName;

                }


                // ******************************************************* getLinkFilePlus *************************************************************
                // 打开本地文件夹，获得文件名，用于填入链接信息。追加填入。
                function getLinkFilePlus(u, d, value) {

                    // 获取文本框dom
                    var doc = $(d);
                    // 获取上传控件dom
                    var upload = $(u);
                    // 获取文件名
                    var fileName = upload.files[0].name;
                    // 获取文件路径
                    var filePath = upload.value;
                    // 将文件名追加入文本框，并去掉两端空格
                    doc.value += " " + fileName;
                    doc.value = doc.value.trim();

                }


                // ****************************************************** openFirstInnerLink ***********************************************************
                // 打开当前高亮的泡泡块块里的第1个链接。
                // lk_url存储着多个url，空格分隔
                function openFirstInnerLink(lk_url) {

                    g_innerLinkCurrentNo = 0;
                    openCurrentInnerLink(lk_url);

                }


                // ***************************************************** openCurrentInnerLink **********************************************************
                // 打开当前高亮的泡泡块块里的链接资料。当存在多个链接时，打开当前的。内嵌打开(sw)，或新标签页独立打开。图片自动适应(af)，或保持原图尺寸。调用openSingleLink()。
                // lk_url存储着多个url，空格分隔
                function openCurrentInnerLink(lk_url) {

                    var t1 = t2 = t3 = t4 = cl = "";
                    var n = 0;

                    // 处理是否新标签页打开和图片自动适应。(sw): same window , 表示在父窗口(当前标签页)打开，否则是新标签页打开；(af):auto fit，表示图片尺寸自动适应，否则保持原图尺寸
                    t1 = lk_url.trim();
                    n = t1.indexOf("(sw)", 0);
                    if (n != -1) { t2 = "(sw)"; }
                    n = t1.indexOf("(af)", 0);
                    if (n != -1) { t2 += "(af)"; }

                    t3 = t1.replace("(sw)", "").replace("(af)", "");

                    // 拆解各个链接的字符串
                    // 对全部链接的总字符串，使用正则表达式替换多个连续空格为一个空格
                    g_innerLink = t3;
                    let str = g_innerLink.trim();
                    str = str.replace(/\s+/g, " ");
                    // 使用空格作为分隔符将字符串分割成数组，这样arr[0]、arr[1]...即为各个图片的文件名
                    let arr = str.split(" ");
                    g_innerLinkTotalNum = arr.length;    // 链接总个数

                    // 打开当前内部链接，切换到最前最后时关闭内部链接窗口
                    if (g_innerLinkCurrentNo >= 0 && g_innerLinkCurrentNo < g_innerLinkTotalNum) {
                        t4 = t2 + arr[g_innerLinkCurrentNo];
                        openSingleLink(t4);
                    } else {
                        closeInnerLink();
                    }

                }


                // ******************************************************* openSingleLink **************************************************************
                // 打开一个链接资料。内嵌打开(sw)，或新标签页独立打开。图片和视频自动适应(af)，或保持原始尺寸。被openFirstInnerLink()、openCurrentInnerLink()调用
                // 设一个计时器，当打开外部html后，收回焦点。每次打开html前先清除计时器，回收内存。
                var g_timerID4HTMLinIframe = null;    // 计时器ID，全局变量
                function openSingleLink(lk_url) {

                    clearTimeout(g_timerID4HTMLinIframe);   // 清除本函数在后面可能设置的计时器，如果此前没有设置也没问题。

                    var t = lk_url, t2;

                    // 如果打开的是AHMM文件，则传递参数func，如果不是AHMM也无影响
                    var f = 3;  // 非全屏播放
                    if (g_inFullScreen) { f = 4; }   // 全屏播放
                    var n = t.indexOf("?", 0);
                    if (n == -1) {
                        t = lk_url + "?func=" + f;
                    } else {
                        t = lk_url + "&func=" + f;
                    }
                    // 传递设备模式
                    if (g_inMobileMode) {   // 如果运行在移动模式
                        t += "&devmode=m";   // 移动模式
                    } else {
                        t += "&devmode=c";   // 电脑模式
                    }

                    n = t.indexOf("(sw)", 0);   // (sw): same window , 表示在父窗口(当前标签页)打开
                    if (n == -1) {   // 新标签页打开

                        t = t.replace("(af)", "");  // 如果新标签页打开，则不涉及尺寸自动适应，直接替换掉(af)标记，不论是否包含(af)
                        window.open(t, "_blank");

                    } else {   // 内嵌打开：在iframe或DIV中，如果是图片则在DIV

                        $("DIV_INNER_FRAME").style.display = "block";
                        $("DIV_INNER_FRAME").style.top = Y_TOPIC_HEIGHT + "px";
                        $("DIV_INNER_FRAME").style.left = X_MARGIN - 5 + "px";

                        t2 = lk_url.replace("(sw)", "");

                        if (isImageByExtension(t2)) {   // 如果是图片，则在DIV中显示

                            // 动态加table，必须如下面动态生成，否则就会出现附加文件目录
                            // 下面图片<img>中，max-width: 100%; max-height: 100%;表示图片最大不能超过父容器元素，这样能保证图片完整地在父容器中显示。
                            // 将高度设为超过父容器高度，可以使图片最大限度地、完整地显示在父容器中，即保持比例铺满。如果wh=""，则按原尺寸显示，但也不能超过父容器。
                            // 所以，如果要图片保持原尺寸（不能超过父容器元素），则wh=""，如果要在父容器内充满地最大显示图片，则给height赋一个大于父容器的值
                            let wh = "";  // 原始尺寸，但不能超过父容器元素
                            if (t2.indexOf("(af)", 0) != -1) {    // 如果是图片自动适应
                                t2 = t2.replace("(af)", "");
                                wh = "height: 2000px;";   // 充满，但不超出
                            }

                            $("DIV_INNER_FRAME").innerHTML = '<table id="INNER_FRAME_TABLE" onclick="nextItem();" style="background-color:transparent;"><tr><td style="width: 1710px; height: 920px; display: flex; justify-content: center; align-items: center; vertical-align: middle; "><img id="INNER_FRAME_PIC" src="" border="0" style="max-width: 100%; max-height: 100%; ' + wh + '" alt="链接图片打开失败：链接图片需要与本脑图文件(html)存储于同一文件夹。"></td></tr></table>';
                            // 上行中，onclick = "nextItem();" 的作用：如果内嵌的是图片，则点击图片就进入到后一项，但如果是视频或网页或本地目录，则不进入。

                            $("INNER_FRAME_TABLE").style.display = "block";
                            $("INNER_FRAME_PIC").src = t2;
                            $("INNER_FRAME_PIC").style.display = "block";

                        } else {   // 如果不是图片，再看看是不是视频，视频也像图片一样拉伸

                            if (isVideoByExtension(t2)) {  // 如果是视频

                                // 动态加table，必须如下面动态生成，否则就会出现附加文件目录
                                // 下面视频<video>中，max-width: 100%; max-height: 100%;表示视频最大不能超过父容器元素，这样能保证视频完整地在父容器中显示。
                                // 将高度设为超过父容器高度，可以使视频最大限度地、完整地显示在父容器中，即保持比例铺满。如果wh=""，则按原尺寸显示，但也不能超过父容器。
                                // 所以，如果要视频保持原尺寸（不能超过父容器元素），则wh=""，如果要在父容器内充满地最大显示视频，则给height赋一个大于父容器的值
                                let wh = "";  // 原始尺寸，但不能超过父容器元素
                                if (t2.indexOf("(af)", 0) != -1) {    // 如果是视频自动适应
                                    t2 = t2.replace("(af)", "");
                                    wh = "height: 2000px;";   // 充满，但不超出
                                }

                                $("DIV_INNER_FRAME").innerHTML = '<table id="INNER_FRAME_TABLE" style="background-color:transparent;"><tr><td style="width: 1710px; height: 920px; display: flex; justify-content: center; align-items: center; vertical-align: middle; "><video id="INNER_FRAME_VID" controls autoplay loop border="0" style="max-width: 100%; max-height: 100%;  ' + wh + '"><source src="" type="video/mp4">视频图片打开失败：浏览器不支持该视频格式，或者，链接视频未与本脑图文件(html)存储于同一文件夹。</video></td></tr></table>';
                                
                                $("INNER_FRAME_TABLE").style.display = "block";
                                $("INNER_FRAME_VID").src = t2;
                                $("INNER_FRAME_VID").style.display = "block";

                            } else {   // 如果不是图片，也不是视频，而是html等，则在iframe中显示。显示本地目录不在此处理。

                                // 动态加iframe，必须如下面动态生成，否则就会出现附加文件目录
                                $("DIV_INNER_FRAME").innerHTML = '<iframe id="INNER_FRAME" style="width: 1720px; height: 926px; padding-left: 0px; background-color: rgb(244,244,244); border: none; text-align: center;"></iframe>';
                                
                                // 当iframe打开外部html时，焦点会转移到新的html上，这样上下页、左右箭头等键盘操作就会不起作用。因此要在html完成load后拿回焦点。$("HOLD_FOCUS")是个隐藏的<input>
                                $("INNER_FRAME").onload = function () {
                                    $("HOLD_FOCUS").focus();
                                };
                                t2 = t2.replace("(af)", "");   // 如果不是图片，则不涉及尺寸自动适应，直接替换掉(af)标记，不论是否包含(af)
                                $("INNER_FRAME").src = t2;
                                $("INNER_FRAME").style.display = "block";
                                $("INNER_FRAME").style.top = Y_TOPIC_HEIGHT + "px";
                                $("INNER_FRAME").style.left = X_MARGIN - 5 + "px";

                            }

                        }

                        // 设置操作浏览链接网页的<div>
                        $("OPERATE_INNER_FRAME").style.display = "block";
                        $("OPERATE_INNER_FRAME").style.height = Y_TOPIC_HEIGHT + "px";

                        // 设置打开内部链接窗口的菜单按钮：刷新、返回
                        if (g_inMobileMode) {
                            $("CLOSE_INNER_LINK").style.display = "none";
                            $("CLOSE_INNER_LINK2").style.display = "block";
                        } else {
                            $("CLOSE_INNER_LINK").style.display = "block";
                            $("CLOSE_INNER_LINK2").style.display = "none";
                        }
                        $("RELOAD_DIR").style.display = "none";

                        // 设置标题
                        var currentTitle = "";
                        if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) { currentTitle = g_bubbleText1[g_currentHighLightNo - 1]; }  // 内部序参量泡泡
                        if (g_currentHighLightNo >= 13) { currentTitle = g_blockText1[g_currentHighLightNo - 12]; }   // 外部关联参量块块
                        $("INNER_TITLE").innerHTML = currentTitle;
                        $("INNER_TITLE2").innerHTML = " »»» " + (g_innerLinkCurrentNo + 1) + "/" + g_innerLinkTotalNum;

                        // 隐藏全屏播放的提示
                        $("CANCEL_FULL_SCREEN_HINT").style.display = "none";

                        // 设置内部链接已打开状态。当前后项翻动时nextItem()、prevItem()根据此值处理
                        g_innerLinkShowing = true;
                    }

                    g_keepHighLight = true;   // 设置保持高亮，否则返回脑图页面时高亮会消失

                    // 当iframe打开外部html时，焦点会转移到新的html上，这样上下页、左右箭头等键盘操作就会不起作用。因此要在html完成load后拿回焦点。
                    // $("HOLD_FOCUS")是个隐藏的<input>
                    // 本函数前面的代码已经在iframe.onload时试图拿回焦点，但有可能不成功。如果不成功，则再拿一次，并在5秒后强制再拿回一次。
                    if (!(document.activeElement === $("HOLD_FOCUS"))) {
                        $("HOLD_FOCUS").focus();
                        g_timerID4HTMLinIframe = setTimeout(function () {  // 此计时器会在本函数一开始就被清除，所以内存中只会存在最后一个，不必担心内存
                            $("HOLD_FOCUS").focus();
                        }, 5000);
                    }

                }


                // ****************************************************** isImageByExtension ***********************************************************
                // 根据扩展名判断是否为图片
                function isImageByExtension(url) {

                    const oneImageExtension = url.substring(url.lastIndexOf('.') + 1).toLowerCase();  // 获取URL的最后一个点之后的部分（即扩展名）
                    const allImageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'tiff', 'svg', 'ico'];  // 定义一组常见的图片文件扩展名
                    return allImageExtensions.includes(oneImageExtension);  // 检查扩展名是否在图片扩展名列表中

                }


                // ****************************************************** isVideoByExtension ***********************************************************
                // 根据扩展名判断是否为视频
                function isVideoByExtension(url) {

                    const oneVideoExtension = url.substring(url.lastIndexOf('.') + 1).toLowerCase();  // 获取URL的最后一个点之后的部分（即扩展名）
                    const allVideoExtensions = ['mp4', 'avi', 'mov', 'webm', 'flv', 'wmv', 'mpeg', 'vob', 'mkv'];  // 定义一组常见的视频文件扩展名
                    return allVideoExtensions.includes(oneVideoExtension);  // 检查扩展名是否在视频扩展名列表中

                }


                // ********************************************************* confirmUpdate *************************************************************
                // 确认升级AHMM文件。注意：不能使用DATA_SAVER整体innerHtml替换，只能一个个数据项替换，否则浏览器会出现html标签解析错误，因为升级时标签有修改
                function confirmUpdate() {

                    var tStr, dataMark, lenthOfDataMark, begin, end, end2, i, j, k, l, m, n, singleDataStr, tStrSingle, dataName, dataValue;
                    var geneInfoExist = false;  // 记录被升级的文件是否存在基因信息，老版本不存在

                    confirmClean();   // 清空当前脑图，将各参数设为默认值

                    tStr = $("old_file").value.trim();
                    if (tStr != "" && tStr != "点击右侧【选择文件】") {

                        // 处理新旧版本数据项名称变化，先将旧版本html中的就数据项名称替换为新的。 g_htmlText已在前面获得被升级AHMM的整个html字符串
                        // 截取g_htmlText中<DATA_SAVER>的那一段
                        begin = g_htmlText.indexOf("<div id=\"DATA_SAVER\"");  // 找到<div id="DATA_SAVER"的位置
                        end = g_htmlText.indexOf("</svg>");    // 第一个出现的位置是数据结束的位置，</svg>在</div>之前，如果它存在的话。老版本使用</svg>
                        end2 = g_htmlText.indexOf("</div>");
                        if (end2 !== -1 && end > end2) { end = end2; }
                        if (begin == -1 || end == -1) {
                            alert("AHMM文件格式错误。");
                            return;
                        }
                        g_htmlText = g_htmlText.slice(begin, end - 1).trim();   // 截取出<DATA_SAVER>的那一段

                        g_htmlText = g_htmlText.replace("P_D_FACEPAGE", "P_D_FACECOVER");    // 新版本中封面的数据项名称改了。只替换第一个，即数据存储区
                        g_htmlText = g_htmlText.replace("P_D_BACKPAGE", "P_D_BACKCOVER");

                        // 按照数据项标签处理
                        tStr = g_htmlText.toLowerCase();
                        dataMark = "text";    // 老版本使用<text>或<data-item>存数据，新版本使用<dr>
                        if (tStr.indexOf("data-item") != -1) { dataMark = "data-item"; }
                        if (tStr.indexOf("dr") != -1) { dataMark = "dr"; }   // 保存时可能自动改为小写
                        lenthOfDataMark = dataMark.length;

                        // 判断是否存在基因信息，老版本不存在，G2024.7.1.1版本后存在，标志是存在 P_D_SELF_ID
                        geneInfoExist = false;
                        if (tStr.indexOf("p_d_self_id") != -1) { geneInfoExist = true; }

                        // 获得各个以"<text "或"<dr "开头的全部数据项
                        // 扫描各个数据项，得到数据项名称和值，然后写到新文件 DATA_SAVER 对应位置
                        while (g_htmlText.length > 0) {
                            tStr = g_htmlText.toLowerCase();
                            i = tStr.indexOf("<" + dataMark + " ");  // 找到一个数据项的开始
                            j = tStr.indexOf("</" + dataMark + ">");  // 找到一个数据项的结束
                            singleDataStr = g_htmlText.slice(i, j + lenthOfDataMark + 3);   // 取出<text ... </text>，或<dr
                            g_htmlText = g_htmlText.slice(j + lenthOfDataMark + 3, g_htmlText.length);  // 砍掉已取出的数据项
                            // 处理单个数据项
                            tStrSingle = singleDataStr.toLowerCase();
                            k = tStrSingle.indexOf("\"");    // 数据项名称从引号后开始
                            l = tStrSingle.indexOf("\"", k + 1);    // 数据项名称在下一个引号结束
                            dataName = singleDataStr.slice(k + 1, l);  // 获得数据项名称
                            m = tStrSingle.indexOf(">", l + 1);    // 数据项值在下一个 > 开始
                            n = tStrSingle.indexOf("</" + dataMark + ">", m + 1);    // 数据项值在下一个 </text> 结束
                            dataValue = singleDataStr.slice(m + 1, n);  // 获得数据项值
                            // 更改新文件中该数据项的值
                            $(dataName).innerHTML = dataValue;
                        }

                        // 左右标签需要特殊处理，因为老版本数据区DATA_SAVER中没有这两个数据项，所以上述代码会返回空串，此时要设为“内部序参量”...
                        dataName = "P_D_IN_MARK";
                        if ($(dataName).innerHTML == "") { $(dataName).innerHTML = "内部序参量"; }
                        dataName = "P_D_OUT_MARK";
                        if ($(dataName).innerHTML == "") { $(dataName).innerHTML = "外部关联参量"; }

                        // 处理基因信息。老版本没有基因信息，则生成；新版本存在基因信息，则不必处理。
                        if (!geneInfoExist) { // 处理老版本，生成基因信息
                            $("P_D_SELF_ID").innerHTML = generateUUIDLikeID();  // 生成UUID
                            $("P_D_SELF_GENERATION").innerHTML = "1";           // 设为第1代
                            $("P_D_SELF_CREATION_TIME").innerHTML = "2022-09-19 00:00:00";   // 统一设置创建时间
                            $("P_D_SELF_CREATION_VERSION").innerHTML = "Version D2022.9.19.9";   // 统一设置创建时AHMM的版本
                            $("P_D_FATHER_ID").innerHTML = "0";
                            $("P_D_FATHER_TITLE").innerHTML = "大系统观阿色全息脑图AHMM";
                            $("P_D_FATHER_INFO").innerHTML = "自由使用 自由复制 自由分享 / 版权所有: 阿色";
                        }
                        $("P_D_SELF_LAST_TIME").innerHTML = getFormattedDateTime();      // 将当前时间设为最后更新时间

                        // 上述操作重写了数据区 DATA_SAVER，但页面显示并没有改变

                        // 清空编辑历史，再保存编辑历史作为第0次
                        g_editHistory = [];
                        saveEditHistory();

                        // 重新显示
                        readAllData();
                        startEdit();
                        hideShowGuideInfo();
                        setAllBySavedData();
                        showCurrentFaceCover();   // 如果存在封面，则显示
                        showLogoPic();    // 如果存在Logo，则显示
                        showBackPicMusic();    // 如果存在背景图片，则显示
                        hideUpdate(); // 隐藏升级窗口
                        hideConfirmQuit();
                        $('UPDATE_AHMM_FILE_FINISH').style.display = 'block';   // 显示升级完成窗口
                        $("WELCOME_COVER").style.display = "none";   // 隐藏黑背景

                    }

                }


                // *********************************************************** clearUpdate *************************************************************
                // 清除升级文件信息
                function clearUpdate() {

                    g_htmlText = "";
                    $("old_file").value = "";

                }


                // ************************************************************ showUpdate *************************************************************
                // 显示升级窗口
                function showUpdate() {

                    closeMenuBox();
                    $("UPDATE_AHMM_FILE_FINISH").style.display = "none";
                    g_htmlText = "";
                    $("old_file").value = "点击右侧【选择文件】";
                    $("UPDATE_AHMM_FILE").style.display = "block";   // 选择升级文件窗口
                    $("WELCOME_COVER").style.display = "block";   // 黑背景

                }


                // ************************************************************ showUpdate *************************************************************
                // 显示AI完成窗口
                function showAIFinish() {

                    $("AI_AHMM_FILE_FINISH").style.display = "block";

                }


                // ****************************************************** restoreFullScreenChar ********************************************************
                // 恢复全屏的符号，在点击泡泡或块块上的连接时，以及新建脑图时，浏览器会退出全屏，这是需要把全屏图标恢复
                function restoreFullScreenChar() {

                    $("ENTER_FULL_SCREEN").style.display = "block";
                    $("CANCEL_FULL_SCREEN").style.display = "none";

                }


                // ***************************************************** goIntoFullScreenAndPlay *******************************************************
                // 进入全屏播放，退出编辑状态，从头开始播放
                // 小米手机浏览器V18.2.150419 存在问题：浏览器全屏后失去焦点，致使翻页笔卡住，需要点击一下屏幕激活，然后翻页笔才有动作
                function goIntoFullScreenAndPlay() {

                    hideShowGuideInfo();   // 隐藏操作向导
                    closeAllBoxes();

                    // 隐藏鼠标指针
                    hideMouse();

                    // 如果存在封面，则显示
                    g_faceCoverCurrentNo = 0;
                    showCurrentFaceCover();

                    // 隐藏封底，不管它是否存在
                    hideBackCover();

                    // 把当前被高亮的bubble复原，并恢复到原来的 zIndex，否则会挡住封面。其他高亮不存在这个问题
                    // g_currentHighLightNo是所有高亮统一编号的：概述为0，  吸引子为1，内部序参量1为2、11为12，   外部参量1为13、5为17
                    if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                        deHighLightBubble(g_currentHighLightNo - 1);
                    }

                    g_currentHighLightNo = -1;  // 必须从概述开始, 进入后一项前会 ++

                    g_maxHighLightNo = -1;     // 记录已高亮显示过的泡泡、块块的最大号，每次全屏播放时都重新开始


                    // 如果渐进式播放，先隐藏全部参量泡泡块块
                    if (g_sequentialPlay != "") {
                        hideAllBeforePlay();
                    }

                    $("ENTER_FULL_SCREEN").style.display = "none";
                    $("CANCEL_FULL_SCREEN").style.display = "block";
                    hideCtrlBarForFullScreen();

                    // 调用浏览器H5的全屏API，包括各种浏览器
                    requestFullScreenOfSys();

                    g_inFullScreen = true;   // 用于决定响应哪些键盘事件

                    // 必要时显示退出播放的提示：当 处于电脑状态 & 没显示过提示 & (普通打开AHMM 或 示例）
                    if (!g_inMobileMode && g_timesHintShowed == 0 && (g_funcMode == "" || g_funcMode == "1")) {
                        $("CANCEL_FULL_SCREEN_HINT").style.display = "block";

                        var myDiv = $("CANCEL_FULL_SCREEN_HINT");

                        // 设置初始透明度为1（完全不透明）
                        myDiv.style.opacity = '1';

                        // 5秒后执行函数，将透明度设置为0（完全透明），然后隐藏div
                        setTimeout(function () {
                            myDiv.style.opacity = '0'; // 透明度变为0，开始渐变

                            // 等待透明度渐变完成后再隐藏div（如果需要的话）
                            setTimeout(function () {
                                myDiv.style.display = 'none'; // 隐藏div
                            }, 5000); // 假设渐变时间是5秒，这里也设置为5秒以确保渐变完成
                        }, 500); // 0.5秒后开始渐变

                        g_timesHintShowed++;

                    }

                    // 播放背景音乐，如果存在的话
                    if (g_backMusic != "") {    // 此处，g_backMusic不能用 $("BACK_MUSIC").src 替换，因为此时后者尚未设定值，为了避免保存时生成files文件夹
                        $("BACK_MUSIC").play();
                    }

                }


                // ***************************************************** requestFullScreenOfSys ********************************************************
                // 调用浏览器H5的全屏API，包括各种浏览器
                // 上下页切换时，浏览器禁止自动进入“软”全屏（即H5 API的全屏，但浏览器自带全屏没问题）。
                // 为了减少跳出全屏，在后项切换操作时（nextItem()），在应该全屏的时候，强制全屏。prevItem()和上下页切换不起作用，因为网页会被重载
                function requestFullScreenOfSys() {

                    var docElm = document.documentElement;
                    if (docElm.requestFullscreen) {
                        docElm.requestFullscreen();
                    }
                    else if (docElm.msRequestFullscreen) {
                        docElm = document.body; // overwrite the element (for IE)
                        docElm.msRequestFullscreen();
                    }
                    else if (docElm.mozRequestFullScreen) {
                        docElm.mozRequestFullScreen();
                    }
                    else if (docElm.webkitRequestFullScreen) {
                        docElm.webkitRequestFullScreen();
                    }

                }


                // ******************************************************* exitFromFullScreen **********************************************************
                // 退出播放，进入编辑状态
                function exitFromFullScreen() {

                    // 恢复鼠标指针
                    restoreHideMouse();

                    $("ENTER_FULL_SCREEN").style.display = "block";
                    $("CANCEL_FULL_SCREEN").style.display = "none";
                    showCtrlBarForFullScreen();

                    if (g_inFullScreen) {
                        // 调用浏览器H5的退出全屏API，包括各种浏览器
                        exitFullScreenOfSys();
                    }

                    g_inFullScreen = false;   // 用于决定响应哪些键盘事件
                    deHighLightAll();         // 去除高亮，不包括泡泡

 
                    restoreAllAfterPlay();    // 恢复全部部件。渐进式播放时会发生隐藏
                    $("CANCEL_FULL_SCREEN_HINT").style.display = "none";   // 隐藏退出播放的提示

                    // 停止背景音乐，如果存在的话
                    if (g_backMusic != "") {    // 此处，g_backMusic不能用 $("BACK_MUSIC").src 替换，因为此时后者尚未设定值，为了避免保存时生成files文件夹
                        $("BACK_MUSIC").pause();
                        $("BACK_MUSIC").currentTime = 0;   // 回到音乐开始处
                    }

                }


                // ******************************************************* exitFullScreenOfSys *********************************************************
                // 调用浏览器H5的退出全屏API，包括各种浏览器
                // 上下页切换时，浏览器禁止自动进入“软”全屏（即H5 API的全屏，但浏览器自带全屏没问题）。
                // 为了减少跳出全屏，在后项切换操作时（nextItem()），在应该全屏的时候，强制全屏。prevItem()和上下页切换不起作用，因为网页会被重载
                function exitFullScreenOfSys() {

                    if (document.exitFullscreen) {
                        document.exitFullscreen();
                    }
                    else if (document.msExitFullscreen) {
                        document.msExitFullscreen();
                    }
                    else if (document.mozCancelFullScreen) {
                        document.mozCancelFullScreen();
                    }
                    else if (document.webkitCancelFullScreen) {
                        document.webkitCancelFullScreen();
                    }

                }


                // ******************************************************** hideAllBeforePlay **********************************************************
                // 为了渐进式播放，隐藏所有部件
                function hideAllBeforePlay() {

                    // 隐藏概述
                    $("GEN_WORDS_BOX").style.display = "none";

                    // 隐藏泡泡
                    for (let i = 0; i <= 11; i++) {
                        $("DIV_IN_" + i).style.display = "none";
                        $("LN" + i).style.display = "none";
                    }

                    // 隐藏块块
                    for (let i = 1; i <= 5; i++) {
                        $("DIV_OUT_" + i).style.display = "none";
                        $("O_P" + i + "_LM").style.display = "none";    // block上的链接不包含在block的<g>里，需要单独处理
                    }

                }


                // ******************************************************** restoreAllAfterPlay ********************************************************
                // 渐进式播放完毕，返回编辑状态时，显示所有使用的部件，未使用的继续隐藏
                // 不能用setAllBySavedData()替代
                function restoreAllAfterPlay() {

                    // 恢复概述
                    $("GEN_WORDS_BOX").style.display = "block";

                    // 恢复泡泡
                    for (let i = 0; i <= 11; i++) {
                        if (g_bubbleText0[i].toLowerCase().indexOf("(hide)") == -1) {
                            $("DIV_IN_" + i).style.display = "block";
                            if (g_colorOpacity[g_colorOpacityNo] < 1.0) {   // 如果配色是透明的，则不显示连线
                                $("LN" + i).style.display = "none";
                            }
                            else {
                                $("LN" + i).style.display = "block";
                            }
                        }
                    }

                    // 恢复块块
                    for (let i = 1; i <= 5; i++) {
                        $("DIV_OUT_" + i).style.display = "block";

                        // block上的链接不包含在block的<g>里，需要单独处理
                        if (g_blockLink[i] != "") {
                            $("O_P" + i + "_LM").style.display = "inline";
                        } else {
                            $("O_P" + i + "_LM").style.display = "none";
                        }
                    }

                }


                // ****************************************************** hideCtrlBarForFullScreen *****************************************************
                // 进入全屏播放状态时，隐藏控制条菜单图标、编辑等操作图标
                function hideCtrlBarForFullScreen() {

                    $("DIR_PAGE").style.display = "none";
                    $("HOME_PAGE").style.display = "none";
                    $("PREV_PAGE").style.display = "none";
                    $("NEXT_PAGE").style.display = "none";
                    $("PREV_ITEM").style.display = "none";
                    $("NEXT_ITEM").style.display = "none";
                    $("MENU_CHAR").style.display = "none";
                    $("CLOSE_THIS_PAGE").style.display = "none";
                    $("DIV_FUNC").style.backgroundColor = "transparent";

                    $("CHANGE_LOGO").style.display = "none";
                    $("CHANGE_BACK_PIC_MUSIC").style.display = "none";
                    $("MAP_TITLE2").style.display = "none";
                    $("O_P1_T4").style.display = "none";
                    $("O_P2_T4").style.display = "none";
                    $("O_P3_T4").style.display = "none";
                    $("O_P4_T4").style.display = "none";
                    $("O_P5_T4").style.display = "none";
                    $("IN_MARK_CLICK").style.display = "none";
                    $("OUT_MARK_CLICK").style.display = "none";
                    $("I_P0_T5").style.display = "none";
                    $("I_P1_T5").style.display = "none";
                    $("I_P2_T5").style.display = "none";
                    $("I_P3_T5").style.display = "none";
                    $("I_P4_T5").style.display = "none";
                    $("I_P5_T5").style.display = "none";
                    $("I_P6_T5").style.display = "none";
                    $("I_P7_T5").style.display = "none";
                    $("I_P8_T5").style.display = "none";
                    $("I_P9_T5").style.display = "none";
                    $("I_P10_T5").style.display = "none";
                    $("I_P11_T5").style.display = "none";
                    $("AUTHOR_DATE3").style.display = "none";
                    $("GEN_WORDS_TEXT2").style.display = "none";

                    closeMenuBox();     // 关掉已经打开的功能菜单
                    $("MENU_CHAR").innerHTML = "≚";

                }


                // ***************************************************** showCtrlBarForFullScreen ******************************************************
                // 退出播放状态，显示图标
                function showCtrlBarForFullScreen() {

                    // 退出全屏时显示菜单、编辑等操作图标,下面的""不能换作"block"，否则...会换行

                    // 读取链接页、封面并设置
                    g_menuBarWidth = 245;
                    g_menuBarLeft = 1556;
                    g_menuCharLeft = 1523;
                    if (g_prevPage == "") {
                        $("PREV_PAGE").style.display = "none";  // 隐藏上一页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("PREV_PAGE").style.display = "";  // 显示上一页图标
                    }

                    if (g_nextPage == "") {
                        $("NEXT_PAGE").style.display = "none";  // 隐藏下一页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("NEXT_PAGE").style.display = "";  // 显示下一页图标
                    }

                    if (g_homePage == "") {
                        $("HOME_PAGE").style.display = "none";  // 隐藏起始页图标
                        g_menuBarWidth -= 30;
                        g_menuBarLeft += 30;
                        g_menuCharLeft += 30;
                    }
                    else {
                        $("HOME_PAGE").style.display = "";  // 显示起始页图标
                    }

                    $("NEXT_ITEM").style.display = "";  // 显示后一项图标
                    $("PREV_ITEM").style.display = "";  // 显示前一项图标

                    $("DIV_FUNC").style.width = g_menuBarWidth + "px";
                    $("DIV_FUNC").style.left = g_menuBarLeft + "px";
                    $("MENU_CHAR").style.left = g_menuCharLeft + "px";

                    $("DIR_PAGE").style.display = "";
                    $("MENU_CHAR").style.display = "";
                    $("CLOSE_THIS_PAGE").style.display = "";
                    $("DIV_FUNC").style.display = "";
                    $("DIV_FUNC").style.backgroundColor = "#888888";

                    $("CHANGE_LOGO").style.display = "";
                    $("CHANGE_BACK_PIC_MUSIC").style.display = "";
                    $("MAP_TITLE2").style.display = "";
                    $("O_P1_T4").style.display = "";
                    $("O_P2_T4").style.display = "";
                    $("O_P3_T4").style.display = "";
                    $("O_P4_T4").style.display = "";
                    $("O_P5_T4").style.display = "";
                    $("IN_MARK_CLICK").style.display = "";
                    $("OUT_MARK_CLICK").style.display = "";
                    $("I_P0_T5").style.display = "";
                    $("I_P1_T5").style.display = "";
                    $("I_P2_T5").style.display = "";
                    $("I_P3_T5").style.display = "";
                    $("I_P4_T5").style.display = "";
                    $("I_P5_T5").style.display = "";
                    $("I_P6_T5").style.display = "";
                    $("I_P7_T5").style.display = "";
                    $("I_P8_T5").style.display = "";
                    $("I_P9_T5").style.display = "";
                    $("I_P10_T5").style.display = "";
                    $("I_P11_T5").style.display = "";
                    $("AUTHOR_DATE3").style.display = "";
                    $("GEN_WORDS_TEXT2").style.display = "";

                }


                // ***************************************************** hideCtrlBarForFullScreen2 *****************************************************
                // 进入全屏播放状态，隐藏图标。
                // 异步延时
                async function hideCtrlBarForFullScreen2() {

                    // 全屏时隐藏菜单、编辑等操作图标
                    g_menuBarShouldDisplay = false;
                    if (!g_inFullScreen) { $("DIV_FUNC2").style.display = "none"; }
                    await sleep(1000);
                    if (g_menuBarShouldDisplay == false) {
                        $("DIV_FUNC2").style.display = "none";

                    }
                }
                // 延时
                function sleep(ms) {
                    return new Promise(resolve => setTimeout(resolve, ms));
                }


                // ****************************************************** showCtrlBarForFullScreen2 ****************************************************
                // 退出播放状态，显示图标
                function showCtrlBarForFullScreen2() {

                    // 全屏时隐藏菜单、编辑等操作图标

                    // 读取链接页、封面并设置
                    var menuBarWidth2 = 185;
                    var menuBarLeft2 = 1586;
                    if (g_prevPage == "") {
                        $("PREV_PAGE2").style.display = "none";  // 隐藏上一页图标
                        menuBarWidth2 -= 30;
                        menuBarLeft2 += 30;
                    }
                    else {
                        $("PREV_PAGE2").style.display = "";  // 显示上一页图标
                    }

                    if (g_nextPage == "") {
                        $("NEXT_PAGE2").style.display = "none";  // 隐藏下一页图标
                        menuBarWidth2 -= 30;
                        menuBarLeft2 += 30;
                    }
                    else {
                        $("NEXT_PAGE2").style.display = "";  // 显示下一页图标
                    }

                    if (g_homePage == "") {
                        $("HOME_PAGE2").style.display = "none";  // 隐藏起始页图标
                        menuBarWidth2 -= 30;
                        menuBarLeft2 += 30;
                    }
                    else {
                        $("HOME_PAGE2").style.display = "";  // 显示起始页图标
                    }

                    $("DIV_FUNC2").style.width = menuBarWidth2 + "px";
                    $("DIV_FUNC2").style.left = menuBarLeft2 + "px";
                    $("DIR_PAGE2").style.display = "";
                    $("DIV_FUNC2").style.display = "";
                    g_menuBarShouldDisplay = true;

                }


                // *****************************************************移动设备端保存/下载脑图 ************************************************************
                // ********************************************************* fake_click ******************************************************************
                // 模仿电脑的点击下载，完成移动设备端保存AHMM的html文件
                function fake_click(obj) {
                    var clickEvent = new MouseEvent('click', {
                        'bubbles': true,
                        'cancelable': true,
                        'view': window,
                        'detail': 1,
                        'screenX': 0,
                        'screenY': 0,
                        'clientX': 0,
                        'clientY': 0,
                        'ctrlKey': false,
                        'shiftKey': false,
                        'altKey': false,
                        'metaKey': false,
                        'button': 0,
                        'relatedTarget': null
                    });
                    obj.dispatchEvent(clickEvent);
                }

                function export_raw(name, data) {
                    var urlObject = window.URL || window.webkitURL || window;
                    var export_blob = new Blob([data], { type: 'text/html' });
                    var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a")
                    save_link.href = urlObject.createObjectURL(export_blob);
                    save_link.download = name;
                    fake_click(save_link);
                }

                function saveAHMMHtml() {
                    var ahmmHtml = document.getElementsByTagName('html')[0].outerHTML;
                    ahmmHtml = "<!DOCTYPE html>\n" + ahmmHtml;   // 移动设备浏览器使用Blob存储的html，没有<!DOCTYPE html>。需要补上，否则从移动设备存下的html文件在PC上显示是会有变化。本文件中各个<input>的height会变小。
                    var strT = $("P_D_TITLE").innerHTML;
                    var ahmmFileName = "ahmm-" + strT.replace(/\s/g, "_");   // 保存html时去掉空格，否则很多地方不兼容  + ".html";
                    console.log(ahmmHtml);
                    export_raw(ahmmFileName, ahmmHtml);
                }


                // ******************************************************* 处理键盘事件 *****************************************************************
                // ***************************************************** setKeyboardCall ***************************************************************
                // 设置键盘快捷键，方向键等控制

                // 设置全局变量，仅由本函数使用：当快速连续按右箭头/pagedown/翻页笔下一页2次，则打开当前高亮处的链接，如果有的话
                var intervalTime1 = 50;   // 连按的间隔时间，毫秒ms，2次按键间隔时间介于两者之间时认为是连按2次。按键一直不抬起不受影响。翻页笔延迟较大，所以此值不能太小或太大。
                var intervalTime2 = 400;
                var keyTimeout = null;    // 计时器ID
                var lastKeyTime = Date.now();
                var nowKeyTime = 0;
                var consecutiveKeys = 0;
                function setKeyboardCall() {

                    var tStr; // 存url，openFirstInnerLink(url)
                    var urlExist = false;

                    document.addEventListener('keydown', function (event) {

                        switch (event.key) {

                            // 高亮显示前一项
                            // 翻页键相当于前/后一项，当到达最前/后面时，如果存在上/下一页则进入
                            // 激光翻页笔相当于PageUp/PageDown
                            case 'ArrowLeft':
                            case 'PageUp':
                                if (g_inFullScreen) {

                                    // 由于安全限制，非Windows（比如苹果电脑、iPad、各种手机）上的浏览器打开新的网页时不允许自动进入全屏，导致每次上下页切换时会退出全屏。
                                    // 为减少影响播放效果，在键盘或翻页笔前后项切换时，强制全屏。鼠标操作时不强制，留出进一步操作的方便性。
                                    requestFullScreenOfSys();

                                    hideMouse();
                                    prevItem();
                                }
                                break;

                            // 高亮显示后一项
                            // 连续按2次时，如果高亮处有链接，则打开
                            case 'ArrowRight':
                            case 'PageDown':

                                if (g_inFullScreen) {

                                    // 由于安全限制，非Windows（比如苹果电脑、iPad、各种手机）上的浏览器打开新的网页时不允许自动进入全屏，导致每次上下页切换时会退出全屏。
                                    // 为减少影响播放效果，在键盘或翻页笔前后项切换时，强制全屏。连击时不强制，否则因请求全屏会导致调用连接失败。鼠标操作时也不强制，留出进一步操作的方便性。
                                    // 在nextItem()前，即切换到后一项时，调用requestFullScreenOfSys()，但连击时不调用

                                    hideMouse();   // 隐藏鼠标指针

                                    // 处理泡泡、块块里的链接
                                    // 获取url，存入tStr
                                    // g_currentHighLightNo: 概述为0，吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                                    tStr = "";
                                    // 内部序参量
                                    if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                                        tStr = g_bubbleLink[g_currentHighLightNo - 1].trim();
                                    }
                                    // 外部参量
                                    if (g_currentHighLightNo >= 13) {
                                        tStr = g_blockLink[g_currentHighLightNo - 12].trim();
                                    }

                                    // 判断是否有链接存在
                                    if (tStr == "" || tStr == "(sw)" || tStr == "(af)" || tStr == "(sw)(af)" || tStr == "(af)(sw)") {  // (sw)代表相同窗口打开链接，即不使用新标签页;(af)代表图片自动适应
                                        urlExist = false;
                                    } else {
                                        urlExist = true;
                                    }

                                    // 如果有链接，则连续2次按键后打开链接；如果没有链接，则直接移动到下一项nextItem()
                                    if (urlExist) {  // 存在链接

                                        consecutiveKeys++;
                                        lastKeyTime = nowKeyTime;
                                        nowKeyTime = Date.now();

                                        // 设置计时器，intervalTime(400ms)后，检查是否发生过连按2次，如果发生过则打开链接
                                        keyTimeout = setTimeout(function () {
                                            if (consecutiveKeys >= 2 && !g_faceCoverShowing && !g_backCoverShowing && g_highLightShowing) {  // 连按2次
                                                if (nowKeyTime - lastKeyTime > intervalTime1 && nowKeyTime - lastKeyTime < intervalTime2) {  // 间隔时间介于两者之间的才被认为是连按2次，太快或太慢都不算
                                                    // 如果打开内部链接的页面已经在显示时，连击就关闭内部链接窗口，否则打开第1个链接
                                                    if (g_innerLinkShowing) {
                                                        closeInnerLink();
                                                    } else {
                                                        openFirstInnerLink(tStr);   // 打开url
                                                    }
                                                } else {
                                                    requestFullScreenOfSys();   // 在键盘或翻页笔前后项切换时，强制全屏。连击时不强制，否则因请求全屏会导致调用连接失败。下同。
                                                    nextItem();
                                                }
                                            } else {
                                                if (consecutiveKeys == 1) { requestFullScreenOfSys(); nextItem(); }   // 按了1次，则不打开url，而是跳到后一项
                                            }
                                            consecutiveKeys = 0;
                                        }, intervalTime2);

                                    } else {  // 不存在链接，直接跳到后一项

                                        requestFullScreenOfSys();
                                        nextItem();
                                        consecutiveKeys = 0;

                                        // 清除之前的计时器
                                        if (keyTimeout) {
                                            clearTimeout(keyTimeout);
                                            keyTimeout = null; // 清除后，通常将变量设置为 null 以避免后续的误用
                                        }

                                    }

                                }
                                break;

                            // 显示上一页
                            case 'ArrowUp':
                                if (g_inFullScreen) {
                                    hideMouse();
                                    prevPage();
                                }
                                break;

                            // 显示下一页
                            case 'ArrowDown':
                                if (g_inFullScreen) {
                                    hideMouse();
                                    nextPage();
                                }
                                break;

                            // 显示首页
                            case 'Home':
                                if (g_inFullScreen) {
                                    hideMouse();
                                    homePage();
                                }
                                break;

                            // 显示目录
                            case 'End':
                                if (g_inFullScreen) {
                                    showDir();
                                }
                                break;

                            // 回车时调高亮的链接
                            case 'Enter':
                                hideShowGuideInfo();   // 隐藏操作向导
                                if (g_inFullScreen && !g_faceCoverShowing && !g_backCoverShowing && g_highLightShowing) {
                                    hideMouse();
                                    // g_currentHighLightNo: 吸引子为1，内部序参量1为2、11为12，外部参量1为13、5为17
                                    // 内部序参量
                                    if (g_currentHighLightNo >= 1 && g_currentHighLightNo <= 12) {
                                        tStr = g_bubbleLink[g_currentHighLightNo - 1];
                                        if (tStr.trim() != "") {
                                            openFirstInnerLink(tStr.trim());
                                        }
                                    }
                                    // 外部参量
                                    if (g_currentHighLightNo >= 13) {
                                        tStr = g_blockLink[g_currentHighLightNo - 12]
                                        if (tStr.trim() != "") {
                                            openFirstInnerLink(tStr.trim());
                                        }
                                    }
                                }
                                break;

                            // 退出播放状态，进入编辑状态。需要连续按2或3次：第1次退出浏览器本身的全屏，第2次退出AHMM的播放，第3次退出封面封底或内联，进入编辑状态。
                            case 'Escape':
                                restoreHideMouse();
                                if (g_inFullScreen) {
                                    exitFromFullScreen();
                                } else {
                                    closeInnerLink(); // 关闭浏览目录、内联的内容，.src=""
                                    hideBackCover();  //隐藏封面、封底
                                    hideFaceCover();
                                }
                                break;

                            // 进入全屏播放状态。不能借用浏览器原来的F11，浏览器禁止
                            // F10不要使用“切换键”（toggle key）模式，与某些浏览器易冲突
                            case 'F10':
                                hideMouse();
                                goIntoFullScreenAndPlay();
                                $("MAP_TITLE").focus();    // 此句不可删除，否则document在浏览器中失去焦点，Esc键不能响应
                                break;

                            default:
                                // 检查组合键
                                if (event.ctrlKey && event.key === 's') {
                                    // 用户按下Ctrl+S，表示保存了脑图，退出时不提示
                                    g_fileModified = 0;
                                    hideShowGuideInfo();   // 隐藏操作向导
                                    hideFaceCover();   // 隐藏封面、封底，.src=""，防止保存时生成附加目录
                                    hideBackCover();
                                    closeInnerLink();    // 关闭浏览目录、内联的内容，.src=""
                                    removeDivsAddedByBrowser();   // 移除由360等浏览器添加的div
                                }
                        }
                    });

                }


                // ****************************************************** 处理移动设备屏幕事件 ***************************************************************
                // ************************************************** setMobileDeviceScreenCall ************************************************************
                // 设置手机等移动设备触屏控制
                function setMobileDeviceScreenCall() {

                    // 处理移动设备触屏。
                    // 翻页 / 翻项：触摸边缘上下 / 左右。重载脑图：左上角。关闭脑图：触摸右上角。返回编辑：左下角。全屏播放：右下角。
                    // 经测试，滑屏效果不好，不采用
                    if (g_inMobileMode) {
                        let touchX, touchY, touchId;
                        let isSwiping = false;

                        document.addEventListener('touchstart', function (e) {
                            // 记录开始触摸的位置和触摸ID
                            touchX = e.touches[0].clientX;
                            touchY = e.touches[0].clientY;
                            touchId = e.touches[0].identifier;

                            // 计算脑图周边可触屏控制的点，因为移动设备各个浏览器显示时位置可能错位，因此无法精准计算，此处按照严格居中计算
                            // 屏幕边缘响应的界限
                            // 左右X：设为脑图左右留白内边以外，1720为中心灰色绘图区 SVG_MAIN的宽度，左右对称
                            let marginXL = (window.innerWidth - 1720 * g_scrnScl) / 2;  // 左X
                            let marginXR = window.innerWidth - marginXL;   // 右X

                            // 顶端Y
                            let marginYT = (window.innerHeight - SCREEN_HEIGHT_STANDARD * g_scrnScl) / 2;  // 屏幕顶端，AHMM没有占用的地方的高度。SCREEN_HEIGHT_STANDARD = 1920
                            marginYT += (135 / 2 * g_scrnScl);    // 135为AHMM标题DIV的高度。此时marginYT大概处于标题文字顶端边缘
                            // 底端Y
                            let marginYB = window.innerHeight - 40 * g_scrnScl;  // 屏幕底端，AHMM没有占用的地方的高度，大概在版权文字底端边缘

                            // 对于细长屏幕，比如20:9，顶端和底端的marginYT和marginYB较小，四角不符合习惯，需要扩大高度
                            // 对于短粗屏幕，这个问题不大，因为脑图左右空白marginXL和marginXR比较显著，不用处理
                            let addY = 0;
                            if (marginXL > marginYT) {
                                addY = (marginXL - marginYT) / 2;
                            }

                            // 检测触摸位置，并操作
                            // 4个角
                            if (!g_innerLinkShowing) {  // 在显示内部链接时，4角触屏不应起作用
                                if (touchX < marginXL && touchY < marginYT + addY) reloadAHMMWithConfirm();   // 左上角，重新打开当前脑图
                                if (touchX > marginXR && touchY < marginYT + addY) quitAHMMWithConfirm(); // 右上角，关闭当前脑图
                                if (touchX < marginXL && touchY > marginYB - addY * 1.5) exitFromFullScreen(); // 左下角，返回编辑状态。*1.5：脑图底部空白更小，再增大左下、右下角的高度
                                if (touchX > marginXR && touchY > marginYB - addY * 1.5) goIntoFullScreenAndPlay(); // 右下角，进入全屏播放
                            }
                            // 4边。只在全屏播放时，并且没有内部链接在显示时，才起作用
                            if (g_inFullScreen) {
                                if (touchY < marginYT && touchX > marginXL && touchX < marginXR && !g_innerLinkShowing) prevPage(); // 顶端（不包括左上角、右上角），上一页。显示内部链接时不起作用，下同。
                                else if (touchY > marginYB && touchX > marginXL && touchX < marginXR && !g_innerLinkShowing) nextPage(); // 底端（不包括左下角、右下角），下一页
                                else if (touchX < marginXL && touchY > marginYT + addY && touchY < marginYB - addY * 1.5) prevItem(); // 左端（不包括左上角、左下角），前一项。显示内部链接时也会起作用，因为要切换各个链接，下同。
                                else if (touchX > marginXR && touchY > marginYT + addY && touchY < marginYB - addY * 1.5) nextItem(); // 右端（不包括右上角、右下角），后一项
                            }
                        }, false);

                        document.addEventListener('touchend', function (e) {
                            // 触屏结束，重置状态
                            isSwiping = false;

                            // 移动设备上始终强制全屏，否则，即使浏览器全屏，手机底端的自带的控制图标键也会显示
                            if (g_inFullScreen) { requestFullScreenOfSys(); }

                        }, false);
                    }

                }


                // ******************************************************** 处理鼠标事件 ****************************************************************
                // ********************************************************* hideMouse *****************************************************************
                // 隐藏鼠标指针
                function hideMouse() {

                    var body = document.body;
                    body.style.cursor = "none";

                }

                // ****************************************************** restoreHideMouse *************************************************************
                // 恢复被隐藏的鼠标指针
                function restoreHideMouse() {

                    var body = document.body;
                    body.style.cursor = "default";

                }


                // ********************************************************** 浏览目录 ******************************************************************
                // ********************************************************** showDir ******************************************************************
                // 设置装载当前目录/本地的<iframe>。打开html或图片不在此处理，而在openFirstInnerLink()
                function showDir() {

                    // 隐藏操作向导
                    hideShowGuideInfo();
                    // 隐藏全部编辑、菜单窗口
                    closeAllBoxes();
                    // 隐藏封面封底
                    hideFaceCover();
                    hideBackCover();
                    $("CANCEL_FULL_SCREEN_HINT").style.display = "none";   // 隐藏退出播放的提示

                    // 为了防止保存时附加目录，应该在需要时动态增加iframe，保存前要去掉
                    $("DIV_INNER_FRAME").style.display = "block";
                    $("DIV_INNER_FRAME").style.top = Y_TOPIC_HEIGHT + "px";
                    $("DIV_INNER_FRAME").style.left = X_MARGIN - 5 + "px";

                    // iframe必须如下面动态生成，否则就会出现附加文件目录
                    $("DIV_INNER_FRAME").innerHTML = '<iframe id="INNER_FRAME" style="width: 1720px; height: 926px; padding-left: 0px; background-color: rgb(244,244,244); border: none; text-align: center;"></iframe>';

                    $("INNER_FRAME").src = ".";
                    $("INNER_FRAME").style.display = "block";
                    $("INNER_FRAME").style.top = Y_TOPIC_HEIGHT + "px";
                    $("INNER_FRAME").style.left = X_MARGIN - 5 + "px";

                    // 设置操作浏览当前目录/本地文件的<div>
                    $("OPERATE_INNER_FRAME").style.display = "block";
                    $("OPERATE_INNER_FRAME").style.height = Y_TOPIC_HEIGHT + "px";

                    // 设置打开内部链接窗口的菜单按钮：刷新、返回
                    if (g_inMobileMode) {
                        $("CLOSE_INNER_LINK").style.display = "none";
                        $("CLOSE_INNER_LINK2").style.display = "block";
                        $("RELOAD_DIR").style.display = "none";
                    } else {
                        $("CLOSE_INNER_LINK").style.display = "block";
                        $("CLOSE_INNER_LINK2").style.display = "none";
                        $("RELOAD_DIR").style.display = "block";
                    }

                    // 设置标题
                    $("INNER_TITLE").innerHTML = "浏览当前目录 / 本地文件";

                    // 设置保持高亮，否则返回脑图页面时高亮会消失
                    g_keepHighLight = true;

                    // 设置内部链接已打开状态。当前后项翻动时nextItem()、prevItem()根据此值处理
                    g_innerLinkShowing = true;

                }


                // ******************************************************* closeInnerLink **************************************************************
                // 关闭内联的当前目录/本地目录、图片、html浏览。[ ↵ ]键和Ctrl+S时调用
                function closeInnerLink() {

                    $('OPERATE_INNER_FRAME').style.display = 'none';
                    $("CLOSE_INNER_LINK2").style.display = 'none';
                    $('DIV_INNER_FRAME').style.display = 'none';
                    $("DIV_INNER_FRAME").innerHTML = "";    // 清空DIV，否则保存时会附带文件夹
                    $("DIV_INNER_FRAME").onclick = "";   // 如果内嵌的是图片，则点击图片就进入到后一项，但如果是视频或网页或本地目录，则不进入。此处设为""，防止前面显示过图片时此值被设为"nextItem();"
                    g_innerLinkShowing = false;

                }


                // **************************************************** setForMobileDevice *************************************************************
                // 为移动设备设置参数
                function setForMobileDevice() {

                    $("BUTTON_PLAY_WELCOME").style.display = "none";   // 隐藏PC的播放键
                    $("FULL_SCREEN_FOR_MOBILEDEVICE").style.display = "block";   // 显示移动设备上的播放键
                    $("SUGGEST_INFO").innerHTML = "* 移动设备：建议使用设备自带浏览器，或谷歌、QQ浏览器。支持整体缩放。";
                    $("SAVE_INFO_FOR_PC").style.display = "none";
                    $("SAVE_INFO_FOR_MOBILEDEVICE").style.display = "block";
                    $("save_ahmm_html").style.display = "inline";
                    $("GUIDE_FOR_PC").style.display = "none";
                    $("GUIDE_FOR_MOBILEDEVICE").style.display = "block";
                    $("ON_PC").style.display = "none";
                    $("ON_MOBILEDEVICE").style.display = "block";

                }


                // ********************************************************** setForPC *****************************************************************
                // 为电脑设置参数
                function setForPC() {

                    $("BUTTON_PLAY_WELCOME").style.display = "inline";   // 显示PC的播放键
                    $("FULL_SCREEN_FOR_MOBILEDEVICE").style.display = "none";   // 隐藏移动设备上的播放键
                    $("SUGGEST_INFO").innerHTML = "* 鼠标悬停可获得快速帮助&nbsp;&nbsp;* 支持键盘、鼠标、翻页笔及手机平板触屏操作&nbsp;&nbsp;* 最佳屏幕分辨率：1920x1080";
                    $("SAVE_INFO_FOR_PC").style.display = "inline";
                    $("SAVE_INFO_FOR_MOBILEDEVICE").style.display = "none";
                    $("save_ahmm_html").style.display = "none";
                    $("GUIDE_FOR_PC").style.display = "block";
                    $("GUIDE_FOR_MOBILEDEVICE").style.display = "none";
                    $("ON_PC").style.display = "block";
                    $("ON_MOBILEDEVICE").style.display = "none";

                }


                // **************************************************  isMobileDeviceByTest ************************************************************
                // 判断是否为移动设备的触摸屏
                // 检测设备是否是触摸屏，如果是，则等同于是移动设备
                // 曾经使用userAgent判断，但有时不准确。而直接判断是否为触摸屏更准确。
                function isMobileDeviceByTest() {

                    // 方法1: 检查ontouchstart事件是否支持
                    const hasTouchStart = 'ontouchstart' in window;
                    
                    // 方法2: 检查最大触摸点数
                    const hasTouchPoints = navigator.maxTouchPoints > 0;
                    
                    // 方法3: 检查MSPointerEnabled (IE10+)
                    const hasMSPointer = window.navigator.msPointerEnabled;
                    
                    // 综合判断
                    return hasTouchStart || hasTouchPoints || hasMSPointer;

                }


                // ********************************************************  显示时间 ******************************************************************
                // 根据设置，在全屏播放时显示当前时间
                // 获取要显示时间的div元素
                var timeDisplay = $('DIV_TIME_DISPLAY');

                // ***************************************************  updateTimeDisplay *************************************************************
                // 定义一个函数来更新时间显示
                function updateTimeDisplay() {

                    if (g_inFullScreen && g_showTimeWhenPlay != "") {  // 如果处于播放状态，且设置了显示时间
                        var now = new Date(); // 获取当前时间
                        var hours = String(now.getHours()).padStart(2, '0'); // 获取小时数，并确保是两位数
                        var minutes = String(now.getMinutes()).padStart(2, '0'); // 获取分钟数，并确保是两位数
                        var seconds = String(now.getSeconds()).padStart(2, '0'); // 获取秒数，并确保是两位数
                        timeDisplay.textContent = hours + ':' + minutes + ':' + seconds; // 更新div的文本内容为时间字符串
                        timeDisplay.style.display = "flex";
                    } else {
                        timeDisplay.style.display = "none";
                    }

                }

                // 调用函数来初始化时间显示
                updateTimeDisplay();

                // 使用setInterval来每秒更新时间显示
                setInterval(updateTimeDisplay, 1000);


                // ******************************************************  全息代际记录 *****************************************************************
                // *************************************************** generateUUIDLikeID **************************************************************
                // 使用Math.random()和Date.now()生成类似UUID的字符串，作为新创建的AHMM文件的唯一ID，这样可以追踪AHMM的代际继承关系，符合全息性
                // 注意：这不是真正的UUID，它没有遵循UUID的完整算法，只是形式类似，但能够保证AHMM的全息追踪，甚至唯一性也不是必须的
                function generateUUIDLikeID() {
                    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
                        var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
                        return v.toString(16);
                    }).replace(/[xy]/g, function (c) {
                        var r = (Date.now() + Math.random() * 16) % 16 | 0;
                        var v = c == 'x' ? r : (r & 0x3 | 0x8);
                        return v.toString(16);
                    }).toLowerCase();
                }


                // ************************************************** getFormattedDateTime *************************************************************
                // 返回格式化的日期和时间：YYYY-MM-DD HH:MM:SS
                function getFormattedDateTime() {
                    const now = new Date();
                    const formattedDate =
                        now.getFullYear() + '-' +
                        (now.getMonth() + 1).toString().padStart(2, '0') + '-' +
                        now.getDate().toString().padStart(2, '0') + ' ' +
                        now.getHours().toString().padStart(2, '0') + ':' +
                        now.getMinutes().toString().padStart(2, '0') + ':' +
                        now.getSeconds().toString().padStart(2, '0');
                    return formattedDate;
                }

                // ************************************************** getCurrentDateFormatted **********************************************************
                // 返回格式化的日期，形如: 2025.6.30
                function getCurrentDateFormatted() {
                    const date = new Date();
                    const year = date.getFullYear();
                    const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
                    const day = String(date.getDate()).padStart(2, '0');
                    return `${year}.${month}.${day}`;
                }

                // *************************************************** myString2IntNumber **************************************************************
                // 字符串转整数，包含负号，字符串中没有数字时返回0。例如："fgg-8.087h  po"返回数字 -8
                function myString2IntNumber(str) {

                    // 使用正则表达式匹配字符串中的数字（包括负号）
                    let numberPart = str.match(/-?\d+/);
                    // 如果找到了数字部分，则将其转换为数字并加1
                    if (numberPart) {
                        return parseInt(numberPart[0]); // 将匹配到的字符串转换为整数
                    } else {
                        return 0;
                    }

                }


                // ******************************************************  删除被附加的<div> ************************************************************
                // **************************************************** removeDivsAddedByBrowser ******************************************************
                // 360浏览器等，会在打开脑图文件时自动加入大量<div>。主要包括：
                // div id="qihooai-assistant-root"
                // div id="ai-assist-root-bangs"
                // 需要在保存文件时把它增加的内容剔除掉
                // 前面已经定义：var g_divsTobeRemoved = ["qihooai-assistant-root", "ai-assist-root-bangs"];
                // 删除全部被浏览器附加的<div>元素
                // 在按 Ctrl+S 时调用本函数
                function removeDivsAddedByBrowser() {
                    var divId;
                    var div;
                    for (var i = 0; i < g_divsTobeRemoved.length; i++) {
                        divId = g_divsTobeRemoved[i];
                        div = $(divId);
                        if (div) {
                            div.parentNode.removeChild(div);
                        }
                    }
                    
                }



                // *********************************************************************************************************************************
                // ****************************************************** 子程序结束 ****************************************************************
                // *********************************************************************************************************************************


                // *********************************************************************************************************************************
                // *********************************************************************************************************************************
                // *************************************************** JavaScript 结束  *************************************************************
                // *********************************************************************************************************************************
                // *********************************************************************************************************************************

            </script>
            <!--=================================================================================================================================-->
            <!--=================================================================================================================================-->
            <!--================================================== html、js代码全部结束 ==========================================================-->
            <!--=================================================================================================================================-->
            <!--=================================================================================================================================-->

</center>


</body>






<!--############################################################# 版本升级记录 #################################################################

【Version ai⁺2025.12.9.19】：2025.7.1
 * 此版本采用 VS Code V1.87.2 + GitHub Copilot + QWen网页版 编程。
 * 发布到 GitHub：https://bgithub.xyz/arthurqwang/ahmm.git
 本版本是 H2025.12.9.19 版之后的升级。
    主要包括：
    1、首次增加AI自动生成脑图的功能。可以从网页或用户自定义文本自动生成脑图。
        服务器端来发了 llmcaller.html，由它根据网页或用户自定义文本调用大模型生成 JSON，让后用 sessionStorage 传递给本文件。
        本文件根据传来的 JSON 生成脑图。

==============================================================================================================================================
【Version H2025.12.9.19】：2025.5.14
 * 此版本采用 VS Code V1.87.2 + Fitten Code 2.8.0 编程。
 * 发布到 GitHub：https://bgithub.xyz/arthurqwang/ahmm.git
 本版本是 H2024.9.19.12 版之后的升级。
    主要包括：
    1、增加播放时彩虹高亮显示各个要素，包括概述、内部序参量泡泡、外部参量块块。
         这样做是为了区分编辑和播放状态。编辑状态仍使用原来的橙色虚线高亮。
    2、增加播放时块块放大功能。
        为了让块块可以放大，将每个块块都作为一个div处理。原来是在整个svg中，无法单独放大。
    3、增加播放时概述放大功能。
    4、修改BUG：手机谷歌chrome 未识别为手机模式的移动设备的问题。
        原来使用userAgent判断，但有时不准确。现改为直接判断是否为触摸屏，这样更准确。
    5、修复BUG：从一个已经由内容的脑图新建一个脑图时，封底图片会带过去。已解决。
    6、优化连线：各连线起始点改为吸引子中心。原来是吸引子的边缘，那样会出现连线混乱。

==============================================================================================================================================
【Version H2024.9.19.12】：2024.11.15
 * 此版本采用 VS Code V1.87.2 + Fitten Code 2.8.0 编程。
 * 开始发布到 GitHub：https://bgithub.xyz/arthurqwang/ahmm.git
 本版本是 H2024.9.19.9 版之后的升级。
    主要包括：
    1、增加【Esc键】返回编辑状态功能：
         在编辑状态(即非播放状态)下，如果封面、封底或浏览当前目录界面正在显示时，按【Esc键】后隐藏封面、封底或目录，显示编辑主界面（即编辑泡泡块块的界面）。
         这样可以方便地编辑脑图，而不必用鼠标切换到编辑主界面。
         当播放完成后，连续3次按【Esc键】可退出播放,并返回到编辑界面。
         本次修改前，按【Esc键】只退出播放，但不返回编辑界面，会停在封底画面。
    2、修改了一个bug：
         问题：脑图页面底端的版权日期信息，在恢复编辑历史时，总是变为2019.9.19。
         原因：SaveAllData() 函数中，保存脑图数据时没有使用全局变量。
         已经改正。
    3、增加移除360浏览器自动添加的ai代码功能：
         由于360浏览器再打开html文件时，会自动添加ai代码，导致ahmm文件增大200K，且增加风险。
         现在，在保存文件 Ctrl+S 时，会自动剔除掉360浏览器自动添加的ai代码。
    4、优化其他功能。

==============================================================================================================================================

【Version H2024.9.19.9】：2024.10.16
 * 此版本采用 VS Code V1.87.2 编程。
 本版本是 G2024.7.2.2 版之后的重要升级。
    主要包括：
    1、增加复制创建新脑图功能：
         基于已存在的全息脑图，创建新脑图，并把原脑图数据自动转到新脑图，同时，自动生成新的文件名和基因ID。
    2、增加故事线模式功能：
         主题词不仅可以像原来那样星形模式布局，也可以以故事线的方式串行布局。
         自动调整两种不同布局时主题词的尺寸和布局形式。
    3、增加功能菜单悬浮提示功能。
    4、增加欢迎页面播放和编辑按钮的悬停提示功能。
    5、增加点击背景切换到后一项的功能。
    6、增加内嵌链接图片时点击图片切换到后一项的功能。
    7、修复从内嵌链接返回后，第一个后一项按键不响应的问题。
    8、修复泡泡跑到封面前面的问题。
    9、优化原来的悬浮提示功能。
    10、开发了【AHMM批量升级工具】，VB6编程，实现批量升级旧版脑图。
    11、将泡泡可拖动的范围修改为全屏幕。
    12、取消建议浏览器360，因为该浏览器自动增加它自己的ai控制代码，这样会使ahmm文件增大200K，且增加风险。
    13、优化其他功能。

==============================================================================================================================================

【Version G2024.7.2.2】：2024.7.19
 * 此版本采用 Visual Studio 2022 编程。此前使用记事本。
 本版本是 F2024.5.1.1 版之后的重要升级，功能增加多，代码增改规模较大，重点优化翻页笔功能。
    使用翻页笔已经非常方便，已实现“一笔到底”，比PPT还方便。翻页笔【连击2次下一页键】的功能特别好用，可播放超链接、返回、切换。
    主要包括：
    1、实现编辑历史恢复功能。
    2、增加播放时显示时间功能。
    3、升级播放功能，实现放大、渐进式播放，支持快捷键、翻页笔、触屏、鼠标。
    4、增加单个主题词缩放比例设置功能。
    5、完善移动设备适应，并增加完整的触屏操作功能，移动设备支持翻页笔。
    6、实现电脑模式/移动模式切换，解决设备识别错误问题，以及需要时的切换。
    7、实现多页封面/封底，以及各个内外参量内部连接信息也可使用多个。
    8、升级数据存储功能，兼容老版本。
    9、改进浏览本地功能。
    10、增加浏览器级关闭页面时的保存提示。
    11、调整功能菜单显示。
    12、增加播放时按回车键、连击【右箭头】或【下一页】或翻页笔【下一页】打开超链接功能；再次连击则退出链接。
    13、增加显示链接标记功能。
    14、增加欢迎页更新提示功能。
    15、增加修改左右标签功能。
    16、增加欢迎页回车直接打开功能。
    17、增加外联网页内嵌显示功能，并可链接多个；图片、视频尺寸可自适应或保持原尺寸。
    18、优化保存提示功能。
    19、PC端欢迎页面增加【播放】键，并设为默认；原【开始】改为【编辑】。
    20、增加退出播放的提示。
    21、优化适应各种屏幕分辨率。
    22、优化其他功能。
    23、针对G2024.6.1.1版：(1)优化Safari界面按钮显示；(2)键盘和翻页笔切换前后项时强制全屏，但鼠标操作时不强制，优化非Windows时播放效果；(3)增加
        脑图基因衍生路径记录功能，每个脑图都赋予一个唯一的ID，用户可查看本脑图和父脑图的代次、遗传等信息；(4)优化版本控制，消除浏览器缓存影响。
        (5)增加了设置脑图整体背景图片和内外参量背景图片的功能。(6)增加了设置背景音乐的功能。

==============================================================================================================================================

目前手机浏览器支持情况：
    1、小米手机浏览器：存在全屏后失去焦点，对翻页笔无反应，需要触屏一下之后才能对翻页笔有反应。
    经测试，即使强制拿回焦点也没用，只能等它自己完善了。其他浏览器都没有这个问题。
    2、Chrome手机浏览器:对带刘海、圆角手机屏幕不能居中显示。
    3、QQ手机浏览器：与Chrome一样的上述问题，另，全屏后手机自带的底端控制图标键不隐藏。
    总体，小米手机浏览器支持较好，使用翻页笔时需要触屏一下。优点是居中显示，手机自带控制键图标可以隐藏。
    一般情况下，移动设备自带浏览器应该支持更好。
    4、关于标签自闭合 "/>" 问题：HTML5规范不需要手动去写自闭合，怎么写都兼容。但SVG要求自闭合。所以，本程序统一使用显式自闭合，即，带"/>"。

==============================================================================================================================================

发布前检查：
1、整理代码。
2、设置只读权限。
3、测试多个浏览器，含移动设备。测试通过：
    (1)PC电脑端：360安全浏览器V14-15; 谷歌Chrome V112-129; 微软Edge V112-129。低版本无法保存脑图。360浏览器V15.3会自动增加它自己的ai代码，不再推荐。
    (2)Android手机端：小米11 Pro:自带浏览器、Chrome、QQ浏览器；华为：QQ浏览器。
    (3)苹果电脑：自带Safari、Chrome。
    (4)iPad：自带Safari。
    (5)苹果手机：自带Safari。


############################################################################################################################################-->


<!--############################################################# 功能设计备忘 #################################################################

【2025.5.13】
1、增加播放时的彩虹高亮，是为了区分编辑和播放状态。
2、泡泡移动到块块之上时，连线仍然保持在块块下面。这是考虑到连线永远不应遮挡主要内容。
    曾考虑：将泡泡连线置于块块之上，但最后还是认为不妥。
3、关于播放时点击、移动泡泡后，是否回到编辑状态后恢复到播放前的位置和z-index？
    目前的设计是：点击、移动泡泡后，将泡泡置顶，回到编辑状态后仍保持播放时的次序。如果用户保存文件，则播放时的次序可以被保存；如果这时用户关闭脑图，将不提
    醒保存。如果用户在编辑状态下点击、移动泡泡，则会提醒保存。
    曾考虑：播放前保存泡泡位置和zindex，播放后返回编辑状态时再恢复，但这样会让用户以为系统有问题，产生迷惑，同时用户在播放状态下的操作将完全无法保存。所以
    最后决定不保存播放前的泡泡位置和zindex。


############################################################################################################################################-->


<!--***************************************************************************************************************************************-->
<!--************************************** 阿色全息脑图 (AHMM: Arthur's Holographic Mind Map) **********************************************-->
<!--***************************************************** Ver ai⁺2025.12.9.19 *************************************************************-->
<!--****************************************************** 更新日期：2025.7.1 **************************************************************-->
<!--********************************************************** 作者：王权 ******************************************************************-->
<!--********************************************* 版权所有 自由使用 自由复制 自由共享 ********************************************************-->
<!--***************************************************************************************************************************************-->

</html>
